@kirbydesign/designsystem 11.4.2 → 11.5.0

package/fesm2022/kirbydesign-designsystem-testing-base.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
 import { forwardRef, Input, Component, EventEmitter, Output, Directive, NgModule } from '@angular/core';
-import { AccordionItemComponent, ChartComponent, StockChartComponent, CheckboxComponent, DividerComponent, FabSheetComponent, FlagComponent, FormFieldMessageComponent, FormFieldComponent, InputComponent, InputCounterComponent, TextareaComponent, IconComponent, ItemGroupComponent, ItemSlidingComponent, AppComponent, ListExperimentalComponent, ListHeaderComponent, ListItemComponent, ListSectionHeaderComponent, ListComponent, LoadingOverlayComponent, PopoverComponent, ProgressCircleRingComponent, ProgressCircleComponent, RadioGroupComponent, RadioComponent, RangeComponent, ReorderListComponent, RouterOutletComponent, SpinnerComponent, SegmentedControlComponent, TabsComponent, KeyHandlerDirective, ModalRouterLinkDirective } from '@kirbydesign/designsystem';
+import { AccordionItemComponent, ChartComponent, StockChartComponent, CheckboxComponent, DividerComponent, FabSheetComponent, FlagComponent, FormFieldMessageComponent, FormFieldComponent, InputComponent, InputCounterComponent, TextareaComponent, IconComponent, ItemGroupComponent, ItemSlidingComponent, AppComponent, ListExperimentalComponent, ListHeaderComponent, ListItemComponent, ListSectionHeaderComponent, ListComponent, LoadingOverlayComponent, ProgressCircleRingComponent, ProgressCircleComponent, RadioGroupComponent, RadioComponent, RangeComponent, ReorderListComponent, RouterOutletComponent, SpinnerComponent, SegmentedControlComponent, TabsComponent, KeyHandlerDirective, ModalRouterLinkDirective } from '@kirbydesign/designsystem';
 import { ActionGroupComponent } from '@kirbydesign/designsystem/action-group';
 import { AvatarComponent } from '@kirbydesign/designsystem/avatar';
 import { ButtonComponent } from '@kirbydesign/designsystem/button';
@@ -15,6 +15,7 @@ import { ItemComponent, LabelComponent } from '@kirbydesign/designsystem/item';
 import { MenuComponent } from '@kirbydesign/designsystem/menu';
 import { ActionSheetComponent, AlertComponent, ModalFooterComponent, ModalCompactWrapperComponent, ModalWrapperComponent } from '@kirbydesign/designsystem/modal';
 import { PageFooterComponent, PageTitleDirective, PageSubtitleDirective, PageToolbarTitleDirective, PageActionsDirective, PageContentDirective, PageStickyContentDirective, PageProgressComponent, PageTitleComponent, PageContentComponent, PageActionsComponent, PageComponent } from '@kirbydesign/designsystem/page';
+import { PopoverComponent } from '@kirbydesign/designsystem/popover';
 import { SectionHeaderComponent } from '@kirbydesign/designsystem/section-header';
 import { SlidesComponent, SlideDirective } from '@kirbydesign/designsystem/slide';
 import { SlideButtonComponent } from '@kirbydesign/designsystem/slide-button';
@@ -31,15 +32,15 @@ import { ComponentLoaderDirective, FitHeadingDirective, ThemeColorDirective } fr
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockAccordionItemComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockAccordionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockAccordionItemComponent, isStandalone: true, selector: "kirby-accordion-item", inputs: { title: "title", isExpanded: "isExpanded", isDisabled: "isDisabled", disabledTitle: "disabledTitle" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockAccordionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockAccordionItemComponent, isStandalone: true, selector: "kirby-accordion-item", inputs: { title: "title", isExpanded: "isExpanded", isDisabled: "isDisabled", disabledTitle: "disabledTitle" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: AccordionItemComponent,
                 useExisting: forwardRef((() => MockAccordionItemComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockAccordionItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockAccordionItemComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-accordion-item',
@@ -64,15 +65,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockActionGroupComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockActionGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockActionGroupComponent, isStandalone: true, selector: "kirby-action-group", inputs: { visibleActions: "visibleActions", emphasizeActions: "emphasizeActions", align: "align" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockActionGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockActionGroupComponent, isStandalone: true, selector: "kirby-action-group", inputs: { visibleActions: "visibleActions", emphasizeActions: "emphasizeActions", align: "align" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ActionGroupComponent,
                 useExisting: forwardRef((() => MockActionGroupComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockActionGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockActionGroupComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-action-group',
@@ -95,15 +96,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockAvatarComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockAvatarComponent, isStandalone: true, selector: "kirby-avatar", inputs: { imageSrc: "imageSrc", altText: "altText", shadow: "shadow", stroke: "stroke", text: "text", overlay: "overlay", size: "size", themeColor: "themeColor" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockAvatarComponent, isStandalone: true, selector: "kirby-avatar", inputs: { imageSrc: "imageSrc", altText: "altText", shadow: "shadow", stroke: "stroke", text: "text", overlay: "overlay", size: "size", themeColor: "themeColor" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: AvatarComponent,
                 useExisting: forwardRef((() => MockAvatarComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockAvatarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockAvatarComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-avatar',
@@ -136,15 +137,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockButtonComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockButtonComponent, isStandalone: true, selector: "button[kirby-button],Button[kirby-button]", inputs: { attentionLevel: "attentionLevel", noDecoration: "noDecoration", themeColor: "themeColor", expand: "expand", isFloating: "isFloating", size: "size", showIconOnly: "showIconOnly" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockButtonComponent, isStandalone: true, selector: "button[kirby-button],Button[kirby-button]", inputs: { attentionLevel: "attentionLevel", noDecoration: "noDecoration", themeColor: "themeColor", expand: "expand", isFloating: "isFloating", size: "size", showIconOnly: "showIconOnly" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ButtonComponent,
                 useExisting: forwardRef((() => MockButtonComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockButtonComponent, decorators: [{
             type: Component,
             args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
@@ -176,15 +177,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockBadgeComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockBadgeComponent, isStandalone: true, selector: "kirby-badge", inputs: { text: "text", size: "size" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockBadgeComponent, isStandalone: true, selector: "kirby-badge", inputs: { text: "text", size: "size" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: BadgeComponent,
                 useExisting: forwardRef((() => MockBadgeComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockBadgeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockBadgeComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-badge',
@@ -212,15 +213,15 @@ class MockCalendarComponent {
         this.previousMonthClicked = new EventEmitter();
         this.nextMonthClicked = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockCalendarComponent, isStandalone: true, selector: "kirby-calendar", inputs: { timezone: "timezone", disableWeekends: "disableWeekends", disablePastDates: "disablePastDates", disableFutureDates: "disableFutureDates", alwaysEnableToday: "alwaysEnableToday", locales: "locales", customLocales: "customLocales", usePopover: "usePopover", yearNavigatorOptions: "yearNavigatorOptions", selectedDate: "selectedDate", disabledDates: "disabledDates", enabledDates: "enabledDates", todayDate: "todayDate", minDate: "minDate", maxDate: "maxDate" }, outputs: { dateChange: "dateChange", dateSelect: "dateSelect", yearSelect: "yearSelect", previousMonthClicked: "previousMonthClicked", nextMonthClicked: "nextMonthClicked" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockCalendarComponent, isStandalone: true, selector: "kirby-calendar", inputs: { timezone: "timezone", disableWeekends: "disableWeekends", disablePastDates: "disablePastDates", disableFutureDates: "disableFutureDates", alwaysEnableToday: "alwaysEnableToday", locales: "locales", customLocales: "customLocales", usePopover: "usePopover", yearNavigatorOptions: "yearNavigatorOptions", selectedDate: "selectedDate", disabledDates: "disabledDates", enabledDates: "enabledDates", todayDate: "todayDate", minDate: "minDate", maxDate: "maxDate" }, outputs: { dateChange: "dateChange", dateSelect: "dateSelect", yearSelect: "yearSelect", previousMonthClicked: "previousMonthClicked", nextMonthClicked: "nextMonthClicked" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: CalendarComponent,
                 useExisting: forwardRef((() => MockCalendarComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockCalendarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockCalendarComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-calendar',
@@ -277,15 +278,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockCardFooterComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockCardFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockCardFooterComponent, isStandalone: true, selector: "kirby-card-footer", inputs: { hasPadding: "hasPadding" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockCardFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockCardFooterComponent, isStandalone: true, selector: "kirby-card-footer", inputs: { hasPadding: "hasPadding" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: CardFooterComponent,
                 useExisting: forwardRef((() => MockCardFooterComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockCardFooterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockCardFooterComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-card-footer',
@@ -304,15 +305,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockCardHeaderComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockCardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockCardHeaderComponent, isStandalone: true, selector: "kirby-card-header", inputs: { title: "title", subtitle: "subtitle", isTitleBold: "isTitleBold", flagged: "flagged", hasPadding: "hasPadding" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockCardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockCardHeaderComponent, isStandalone: true, selector: "kirby-card-header", inputs: { title: "title", subtitle: "subtitle", isTitleBold: "isTitleBold", flagged: "flagged", hasPadding: "hasPadding" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: CardHeaderComponent,
                 useExisting: forwardRef((() => MockCardHeaderComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockCardHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockCardHeaderComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-card-header',
@@ -339,15 +340,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockCardComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockCardComponent, isStandalone: true, selector: "kirby-card", inputs: { title: "title", subtitle: "subtitle", backgroundImageUrl: "backgroundImageUrl", hasPadding: "hasPadding", sizes: "sizes", flat: "flat" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockCardComponent, isStandalone: true, selector: "kirby-card", inputs: { title: "title", subtitle: "subtitle", backgroundImageUrl: "backgroundImageUrl", hasPadding: "hasPadding", sizes: "sizes", flat: "flat" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: CardComponent,
                 useExisting: forwardRef((() => MockCardComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockCardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockCardComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-card',
@@ -376,15 +377,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockBaseChartComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockBaseChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockBaseChartComponent, isStandalone: true, selector: "kirby-base-chart", inputs: { type: "type", data: "data", labels: "labels", customOptions: "customOptions", annotations: "annotations", highlightedElements: "highlightedElements", height: "height" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockBaseChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockBaseChartComponent, isStandalone: true, selector: "kirby-base-chart", inputs: { type: "type", data: "data", labels: "labels", customOptions: "customOptions", annotations: "annotations", highlightedElements: "highlightedElements", height: "height" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: BaseChartComponent,
                 useExisting: forwardRef((() => MockBaseChartComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockBaseChartComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockBaseChartComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-base-chart',
@@ -415,15 +416,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockChartComponent extends MockBaseChartComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockChartComponent, isStandalone: true, selector: "kirby-chart", inputs: { type: "type" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockChartComponent, isStandalone: true, selector: "kirby-chart", inputs: { type: "type" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ChartComponent,
                 useExisting: forwardRef((() => MockChartComponent)),
             },
         ], usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockChartComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockChartComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-chart',
@@ -442,15 +443,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockStockChartComponent extends MockBaseChartComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockStockChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockStockChartComponent, isStandalone: true, selector: "kirby-stock-chart", inputs: { dataLabelOptions: "dataLabelOptions" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockStockChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockStockChartComponent, isStandalone: true, selector: "kirby-stock-chart", inputs: { dataLabelOptions: "dataLabelOptions" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: StockChartComponent,
                 useExisting: forwardRef((() => MockStockChartComponent)),
             },
         ], usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockStockChartComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockStockChartComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-stock-chart',
@@ -472,15 +473,15 @@ class MockCheckboxComponent {
     constructor() {
         this.checkedChange = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockCheckboxComponent, isStandalone: true, selector: "kirby-checkbox", inputs: { checked: "checked", attentionLevel: "attentionLevel", text: "text", size: "size", hasError: "hasError", disabled: "disabled" }, outputs: { checkedChange: "checkedChange" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockCheckboxComponent, isStandalone: true, selector: "kirby-checkbox", inputs: { checked: "checked", attentionLevel: "attentionLevel", text: "text", size: "size", hasError: "hasError", disabled: "disabled" }, outputs: { checkedChange: "checkedChange" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: CheckboxComponent,
                 useExisting: forwardRef((() => MockCheckboxComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockCheckboxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockCheckboxComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-checkbox',
@@ -511,15 +512,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockDividerComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockDividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockDividerComponent, isStandalone: true, selector: "kirby-divider", inputs: { hasMargin: "hasMargin" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockDividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockDividerComponent, isStandalone: true, selector: "kirby-divider", inputs: { hasMargin: "hasMargin" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: DividerComponent,
                 useExisting: forwardRef((() => MockDividerComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockDividerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockDividerComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-divider',
@@ -541,15 +542,15 @@ class MockDropdownComponent {
     constructor() {
         this.change = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockDropdownComponent, isStandalone: true, selector: "kirby-dropdown", inputs: { items: "items", selectedIndex: "selectedIndex", focusedIndex: "focusedIndex", itemTextProperty: "itemTextProperty", placeholder: "placeholder", popout: "popout", attentionLevel: "attentionLevel", expand: "expand", disabled: "disabled", hasError: "hasError", size: "size", tabindex: "tabindex", usePopover: "usePopover" }, outputs: { change: "change" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockDropdownComponent, isStandalone: true, selector: "kirby-dropdown", inputs: { items: "items", selectedIndex: "selectedIndex", focusedIndex: "focusedIndex", itemTextProperty: "itemTextProperty", placeholder: "placeholder", popout: "popout", attentionLevel: "attentionLevel", expand: "expand", disabled: "disabled", hasError: "hasError", size: "size", tabindex: "tabindex", usePopover: "usePopover" }, outputs: { change: "change" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: DropdownComponent,
                 useExisting: forwardRef((() => MockDropdownComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockDropdownComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockDropdownComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-dropdown',
@@ -594,15 +595,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockEmptyStateComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockEmptyStateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockEmptyStateComponent, isStandalone: true, selector: "kirby-empty-state", inputs: { iconName: "iconName", title: "title", subtitle: "subtitle" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockEmptyStateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockEmptyStateComponent, isStandalone: true, selector: "kirby-empty-state", inputs: { iconName: "iconName", title: "title", subtitle: "subtitle" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: EmptyStateComponent,
                 useExisting: forwardRef((() => MockEmptyStateComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockEmptyStateComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockEmptyStateComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-empty-state',
@@ -625,15 +626,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockFabSheetComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockFabSheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockFabSheetComponent, isStandalone: true, selector: "kirby-fab-sheet", inputs: { disabled: "disabled", horizontalAlignment: "horizontalAlignment" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockFabSheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockFabSheetComponent, isStandalone: true, selector: "kirby-fab-sheet", inputs: { disabled: "disabled", horizontalAlignment: "horizontalAlignment" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: FabSheetComponent,
                 useExisting: forwardRef((() => MockFabSheetComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockFabSheetComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockFabSheetComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-fab-sheet',
@@ -654,15 +655,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockFlagComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockFlagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockFlagComponent, isStandalone: true, selector: "kirby-flag", inputs: { size: "size", themeColor: "themeColor" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockFlagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockFlagComponent, isStandalone: true, selector: "kirby-flag", inputs: { size: "size", themeColor: "themeColor" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: FlagComponent,
                 useExisting: forwardRef((() => MockFlagComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockFlagComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockFlagComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-flag',
@@ -683,15 +684,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockFormFieldMessageComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockFormFieldMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockFormFieldMessageComponent, isStandalone: true, selector: "kirby-form-field-message", inputs: { text: "text", position: "position" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockFormFieldMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockFormFieldMessageComponent, isStandalone: true, selector: "kirby-form-field-message", inputs: { text: "text", position: "position" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: FormFieldMessageComponent,
                 useExisting: forwardRef((() => MockFormFieldMessageComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockFormFieldMessageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockFormFieldMessageComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-form-field-message',
@@ -715,15 +716,15 @@ class MockFormFieldComponent {
     focus() {
         // NOOP
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockFormFieldComponent, isStandalone: true, selector: "kirby-form-field", inputs: { label: "label", message: "message" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockFormFieldComponent, isStandalone: true, selector: "kirby-form-field", inputs: { label: "label", message: "message" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: FormFieldComponent,
                 useExisting: forwardRef((() => MockFormFieldComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockFormFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockFormFieldComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-form-field',
@@ -744,15 +745,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockInputComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockInputComponent, isStandalone: true, selector: "input[kirby-input]", inputs: { type: "type", size: "size", borderless: "borderless", hasError: "hasError", autocomplete: "autocomplete", autocorrect: "autocorrect", value: "value", maxlength: "maxlength", inputmode: "inputmode" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockInputComponent, isStandalone: true, selector: "input[kirby-input]", inputs: { type: "type", size: "size", borderless: "borderless", hasError: "hasError", autocomplete: "autocomplete", autocorrect: "autocorrect", value: "value", maxlength: "maxlength", inputmode: "inputmode" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: InputComponent,
                 useExisting: forwardRef((() => MockInputComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockInputComponent, decorators: [{
             type: Component,
             args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
@@ -788,15 +789,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockInputCounterComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockInputCounterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockInputCounterComponent, isStandalone: true, selector: "kirby-input-counter", inputs: { listenTo: "listenTo" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockInputCounterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockInputCounterComponent, isStandalone: true, selector: "kirby-input-counter", inputs: { listenTo: "listenTo" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: InputCounterComponent,
                 useExisting: forwardRef((() => MockInputCounterComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockInputCounterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockInputCounterComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-input-counter',
@@ -815,15 +816,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockTextareaComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockTextareaComponent, isStandalone: true, selector: "textarea[kirby-textarea]", inputs: { value: "value", borderless: "borderless", hasError: "hasError", autocomplete: "autocomplete", autocorrect: "autocorrect", maxlength: "maxlength" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockTextareaComponent, isStandalone: true, selector: "textarea[kirby-textarea]", inputs: { value: "value", borderless: "borderless", hasError: "hasError", autocomplete: "autocomplete", autocorrect: "autocorrect", maxlength: "maxlength" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: TextareaComponent,
                 useExisting: forwardRef((() => MockTextareaComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockTextareaComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockTextareaComponent, decorators: [{
             type: Component,
             args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
@@ -853,15 +854,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockHeaderActionsDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockHeaderActionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockHeaderActionsDirective, isStandalone: true, selector: "[kirbyHeaderActions]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockHeaderActionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockHeaderActionsDirective, isStandalone: true, selector: "[kirbyHeaderActions]", providers: [
             {
                 provide: HeaderActionsDirective,
                 useExisting: forwardRef((() => MockHeaderActionsDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockHeaderActionsDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockHeaderActionsDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyHeaderActions]',
@@ -874,15 +875,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 }]
         }] });
 class MockHeaderCustomSectionDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockHeaderCustomSectionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockHeaderCustomSectionDirective, isStandalone: true, selector: "[kirbyHeaderCustomSection]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockHeaderCustomSectionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockHeaderCustomSectionDirective, isStandalone: true, selector: "[kirbyHeaderCustomSection]", providers: [
             {
                 provide: HeaderCustomSectionDirective,
                 useExisting: forwardRef((() => MockHeaderCustomSectionDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockHeaderCustomSectionDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockHeaderCustomSectionDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyHeaderCustomSection]',
@@ -895,15 +896,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 }]
         }] });
 class MockHeaderComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockHeaderComponent, isStandalone: true, selector: "kirby-header", inputs: { centered: "centered", titleMaxLines: "titleMaxLines", emphasizeActions: "emphasizeActions", title: "title", value: "value", valueUnit: "valueUnit", subtitle1: "subtitle1", subtitle2: "subtitle2" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockHeaderComponent, isStandalone: true, selector: "kirby-header", inputs: { centered: "centered", titleMaxLines: "titleMaxLines", emphasizeActions: "emphasizeActions", title: "title", value: "value", valueUnit: "valueUnit", subtitle1: "subtitle1", subtitle2: "subtitle2" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: HeaderComponent,
                 useExisting: forwardRef((() => MockHeaderComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockHeaderComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-header',
@@ -936,15 +937,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockIconComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockIconComponent, isStandalone: true, selector: "kirby-icon", inputs: { size: "size", name: "name" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockIconComponent, isStandalone: true, selector: "kirby-icon", inputs: { size: "size", name: "name" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: IconComponent,
                 useExisting: forwardRef((() => MockIconComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockIconComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockIconComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-icon',
@@ -965,15 +966,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockItemComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockItemComponent, isStandalone: true, selector: "kirby-item", inputs: { disabled: "disabled", selected: "selected", disclosure: "disclosure", selectable: "selectable", reorderable: "reorderable", size: "size" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockItemComponent, isStandalone: true, selector: "kirby-item", inputs: { disabled: "disabled", selected: "selected", disclosure: "disclosure", selectable: "selectable", reorderable: "reorderable", size: "size" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ItemComponent,
                 useExisting: forwardRef((() => MockItemComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockItemComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-item',
@@ -1002,15 +1003,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockLabelComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockLabelComponent, isStandalone: true, selector: "kirby-label", inputs: { direction: "direction" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockLabelComponent, isStandalone: true, selector: "kirby-label", inputs: { direction: "direction" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: LabelComponent,
                 useExisting: forwardRef((() => MockLabelComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockLabelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockLabelComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-label',
@@ -1029,15 +1030,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockItemGroupComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockItemGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockItemGroupComponent, isStandalone: true, selector: "kirby-item-group", host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockItemGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockItemGroupComponent, isStandalone: true, selector: "kirby-item-group", host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ItemGroupComponent,
                 useExisting: forwardRef((() => MockItemGroupComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockItemGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockItemGroupComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-item-group',
@@ -1054,15 +1055,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockItemSlidingComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockItemSlidingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockItemSlidingComponent, isStandalone: true, selector: "kirby-item-sliding", inputs: { swipeActions: "swipeActions", side: "side" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockItemSlidingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockItemSlidingComponent, isStandalone: true, selector: "kirby-item-sliding", inputs: { swipeActions: "swipeActions", side: "side" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ItemSlidingComponent,
                 useExisting: forwardRef((() => MockItemSlidingComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockItemSlidingComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockItemSlidingComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-item-sliding',
@@ -1083,15 +1084,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockAppComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockAppComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockAppComponent, isStandalone: true, selector: "kirby-app", host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockAppComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockAppComponent, isStandalone: true, selector: "kirby-app", host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: AppComponent,
                 useExisting: forwardRef((() => MockAppComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockAppComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockAppComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-app',
@@ -1108,15 +1109,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockListExperimentalComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListExperimentalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockListExperimentalComponent, isStandalone: true, selector: "kirby-list-experimental", host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListExperimentalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockListExperimentalComponent, isStandalone: true, selector: "kirby-list-experimental", host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ListExperimentalComponent,
                 useExisting: forwardRef((() => MockListExperimentalComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListExperimentalComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListExperimentalComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-list-experimental',
@@ -1133,15 +1134,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockListHeaderComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockListHeaderComponent, isStandalone: true, selector: "kirby-list-header", host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockListHeaderComponent, isStandalone: true, selector: "kirby-list-header", host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ListHeaderComponent,
                 useExisting: forwardRef((() => MockListHeaderComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListHeaderComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-list-header',
@@ -1162,15 +1163,15 @@ class MockListItemComponent {
         this.itemSelect = new EventEmitter();
         this.swipeActionSelect = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockListItemComponent, isStandalone: true, selector: "kirby-list-item", inputs: { item: "item", boundaryClass: "boundaryClass", swipeActions: "swipeActions", itemTemplate: "itemTemplate", isSelected: "isSelected", isSelectable: "isSelectable", getItemColor: "getItemColor" }, outputs: { itemSelect: "itemSelect", swipeActionSelect: "swipeActionSelect" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockListItemComponent, isStandalone: true, selector: "kirby-list-item", inputs: { item: "item", boundaryClass: "boundaryClass", swipeActions: "swipeActions", itemTemplate: "itemTemplate", isSelected: "isSelected", isSelectable: "isSelectable", getItemColor: "getItemColor" }, outputs: { itemSelect: "itemSelect", swipeActionSelect: "swipeActionSelect" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ListItemComponent,
                 useExisting: forwardRef((() => MockListItemComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListItemComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-list-item',
@@ -1205,15 +1206,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockListSectionHeaderComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListSectionHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockListSectionHeaderComponent, isStandalone: true, selector: "kirby-list-section-header", inputs: { title: "title" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListSectionHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockListSectionHeaderComponent, isStandalone: true, selector: "kirby-list-section-header", inputs: { title: "title" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ListSectionHeaderComponent,
                 useExisting: forwardRef((() => MockListSectionHeaderComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListSectionHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListSectionHeaderComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-list-section-header',
@@ -1236,15 +1237,15 @@ class MockListComponent {
         this.loadOnDemand = new EventEmitter();
         this.itemSelect = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockListComponent, isStandalone: true, selector: "kirby-list", inputs: { items: "items", getItemColor: "getItemColor", getSectionName: "getSectionName", trackBy: "trackBy", getStandAloneByProperty: "getStandAloneByProperty", standAloneSpacing: "standAloneSpacing", noMoreItemsText: "noMoreItemsText", showDivider: "showDivider", markSelectedRow: "markSelectedRow", shape: "shape", hasItemSpacing: "hasItemSpacing", isLoadOnDemandEnabled: "isLoadOnDemandEnabled", swipeActions: "swipeActions", disableSelectionHighlight: "disableSelectionHighlight" }, outputs: { loadOnDemand: "loadOnDemand", itemSelect: "itemSelect" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockListComponent, isStandalone: true, selector: "kirby-list", inputs: { items: "items", getItemColor: "getItemColor", getSectionName: "getSectionName", trackBy: "trackBy", getStandAloneByProperty: "getStandAloneByProperty", standAloneSpacing: "standAloneSpacing", noMoreItemsText: "noMoreItemsText", showDivider: "showDivider", markSelectedRow: "markSelectedRow", shape: "shape", hasItemSpacing: "hasItemSpacing", isLoadOnDemandEnabled: "isLoadOnDemandEnabled", swipeActions: "swipeActions", disableSelectionHighlight: "disableSelectionHighlight" }, outputs: { loadOnDemand: "loadOnDemand", itemSelect: "itemSelect" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ListComponent,
                 useExisting: forwardRef((() => MockListComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-list',
@@ -1293,15 +1294,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockLoadingOverlayComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockLoadingOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockLoadingOverlayComponent, isStandalone: true, selector: "kirby-loading-overlay", inputs: { isLoading: "isLoading", showBackdrop: "showBackdrop", hideContent: "hideContent" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockLoadingOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockLoadingOverlayComponent, isStandalone: true, selector: "kirby-loading-overlay", inputs: { isLoading: "isLoading", showBackdrop: "showBackdrop", hideContent: "hideContent" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: LoadingOverlayComponent,
                 useExisting: forwardRef((() => MockLoadingOverlayComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockLoadingOverlayComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockLoadingOverlayComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-loading-overlay',
@@ -1324,15 +1325,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockMenuComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockMenuComponent, isStandalone: true, selector: "kirby-menu", inputs: { isDisabled: "isDisabled", buttonSize: "buttonSize", placement: "placement", attentionLevel: "attentionLevel", triggers: "triggers", DOMPortalOutlet: "DOMPortalOutlet", portalOutletConfig: "portalOutletConfig", autoPlacement: "autoPlacement", closeOnSelect: "closeOnSelect", closeOnEscapeKey: "closeOnEscapeKey", closeOnBackdrop: "closeOnBackdrop", minWidth: "minWidth" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockMenuComponent, isStandalone: true, selector: "kirby-menu", inputs: { isDisabled: "isDisabled", buttonSize: "buttonSize", placement: "placement", attentionLevel: "attentionLevel", triggers: "triggers", DOMPortalOutlet: "DOMPortalOutlet", portalOutletConfig: "portalOutletConfig", autoPlacement: "autoPlacement", closeOnSelect: "closeOnSelect", closeOnEscapeKey: "closeOnEscapeKey", closeOnBackdrop: "closeOnBackdrop", minWidth: "minWidth" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: MenuComponent,
                 useExisting: forwardRef((() => MockMenuComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockMenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockMenuComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-menu',
@@ -1377,15 +1378,15 @@ class MockActionSheetComponent {
         this.cancel = new EventEmitter();
         this.itemSelect = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockActionSheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockActionSheetComponent, isStandalone: true, selector: "kirby-action-sheet", inputs: { cancelButtonText: "cancelButtonText", hideCancel: "hideCancel", disabled: "disabled", header: "header", subheader: "subheader", items: "items" }, outputs: { cancel: "cancel", itemSelect: "itemSelect" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockActionSheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockActionSheetComponent, isStandalone: true, selector: "kirby-action-sheet", inputs: { cancelButtonText: "cancelButtonText", hideCancel: "hideCancel", disabled: "disabled", header: "header", subheader: "subheader", items: "items" }, outputs: { cancel: "cancel", itemSelect: "itemSelect" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ActionSheetComponent,
                 useExisting: forwardRef((() => MockActionSheetComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockActionSheetComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockActionSheetComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-action-sheet',
@@ -1418,15 +1419,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockAlertComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockAlertComponent, isStandalone: true, selector: "kirby-alert", inputs: { title: "title", message: "message", iconName: "iconName", iconThemeColor: "iconThemeColor", okBtn: "okBtn", okBtnIsDestructive: "okBtnIsDestructive", cancelBtn: "cancelBtn" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockAlertComponent, isStandalone: true, selector: "kirby-alert", inputs: { title: "title", message: "message", iconName: "iconName", iconThemeColor: "iconThemeColor", okBtn: "okBtn", okBtnIsDestructive: "okBtnIsDestructive", cancelBtn: "cancelBtn" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: AlertComponent,
                 useExisting: forwardRef((() => MockAlertComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockAlertComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockAlertComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-alert',
@@ -1457,15 +1458,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockModalFooterComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockModalFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockModalFooterComponent, isStandalone: true, selector: "kirby-modal-footer", inputs: { snapToKeyboard: "snapToKeyboard", type: "type" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockModalFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockModalFooterComponent, isStandalone: true, selector: "kirby-modal-footer", inputs: { snapToKeyboard: "snapToKeyboard", type: "type" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ModalFooterComponent,
                 useExisting: forwardRef((() => MockModalFooterComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockModalFooterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockModalFooterComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-modal-footer',
@@ -1486,15 +1487,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockModalCompactWrapperComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockModalCompactWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockModalCompactWrapperComponent, isStandalone: true, selector: "kirby-modal-compact-wrapper", inputs: { config: "config" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockModalCompactWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockModalCompactWrapperComponent, isStandalone: true, selector: "kirby-modal-compact-wrapper", inputs: { config: "config" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ModalCompactWrapperComponent,
                 useExisting: forwardRef((() => MockModalCompactWrapperComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockModalCompactWrapperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockModalCompactWrapperComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-modal-compact-wrapper',
@@ -1519,15 +1520,15 @@ class MockModalWrapperComponent {
     removeModalElement() {
         // NOOP
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockModalWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockModalWrapperComponent, isStandalone: true, selector: "kirby-modal-wrapper", inputs: { config: "config" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockModalWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockModalWrapperComponent, isStandalone: true, selector: "kirby-modal-wrapper", inputs: { config: "config" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ModalWrapperComponent,
                 useExisting: forwardRef((() => MockModalWrapperComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockModalWrapperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockModalWrapperComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-modal-wrapper',
@@ -1546,15 +1547,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockPageFooterComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockPageFooterComponent, isStandalone: true, selector: "kirby-page-footer", inputs: { hasPadding: "hasPadding" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockPageFooterComponent, isStandalone: true, selector: "kirby-page-footer", inputs: { hasPadding: "hasPadding" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: PageFooterComponent,
                 useExisting: forwardRef((() => MockPageFooterComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageFooterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageFooterComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-page-footer',
@@ -1573,15 +1574,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockPageTitleDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockPageTitleDirective, isStandalone: true, selector: "[kirbyPageTitle]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockPageTitleDirective, isStandalone: true, selector: "[kirbyPageTitle]", providers: [
             {
                 provide: PageTitleDirective,
                 useExisting: forwardRef((() => MockPageTitleDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageTitleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageTitleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyPageTitle]',
@@ -1594,15 +1595,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 }]
         }] });
 class MockPageSubtitleDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageSubtitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockPageSubtitleDirective, isStandalone: true, selector: "[kirbyPageSubtitle]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageSubtitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockPageSubtitleDirective, isStandalone: true, selector: "[kirbyPageSubtitle]", providers: [
             {
                 provide: PageSubtitleDirective,
                 useExisting: forwardRef((() => MockPageSubtitleDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageSubtitleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageSubtitleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyPageSubtitle]',
@@ -1615,15 +1616,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 }]
         }] });
 class MockPageToolbarTitleDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageToolbarTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockPageToolbarTitleDirective, isStandalone: true, selector: "[kirbyPageToolbarTitle]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageToolbarTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockPageToolbarTitleDirective, isStandalone: true, selector: "[kirbyPageToolbarTitle]", providers: [
             {
                 provide: PageToolbarTitleDirective,
                 useExisting: forwardRef((() => MockPageToolbarTitleDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageToolbarTitleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageToolbarTitleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyPageToolbarTitle]',
@@ -1636,15 +1637,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 }]
         }] });
 class MockPageActionsDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageActionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockPageActionsDirective, isStandalone: true, selector: "[kirbyPageActions]", inputs: { config: ["kirbyPageActions", "config"] }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageActionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockPageActionsDirective, isStandalone: true, selector: "[kirbyPageActions]", inputs: { config: ["kirbyPageActions", "config"] }, providers: [
             {
                 provide: PageActionsDirective,
                 useExisting: forwardRef((() => MockPageActionsDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageActionsDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageActionsDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyPageActions]',
@@ -1660,15 +1661,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 args: ['kirbyPageActions']
             }] } });
 class MockPageContentDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockPageContentDirective, isStandalone: true, selector: "[kirbyPageContent]", inputs: { config: ["kirbyPageContent", "config"] }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockPageContentDirective, isStandalone: true, selector: "[kirbyPageContent]", inputs: { config: ["kirbyPageContent", "config"] }, providers: [
             {
                 provide: PageContentDirective,
                 useExisting: forwardRef((() => MockPageContentDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageContentDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageContentDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyPageContent]',
@@ -1684,15 +1685,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 args: ['kirbyPageContent']
             }] } });
 class MockPageStickyContentDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageStickyContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockPageStickyContentDirective, isStandalone: true, selector: "[kirbyPageStickyContent]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageStickyContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockPageStickyContentDirective, isStandalone: true, selector: "[kirbyPageStickyContent]", providers: [
             {
                 provide: PageStickyContentDirective,
                 useExisting: forwardRef((() => MockPageStickyContentDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageStickyContentDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageStickyContentDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyPageStickyContent]',
@@ -1705,15 +1706,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 }]
         }] });
 class MockPageProgressComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageProgressComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockPageProgressComponent, isStandalone: true, selector: "kirby-page-progress", host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageProgressComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockPageProgressComponent, isStandalone: true, selector: "kirby-page-progress", host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: PageProgressComponent,
                 useExisting: forwardRef((() => MockPageProgressComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageProgressComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageProgressComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-page-progress',
@@ -1728,15 +1729,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 }]
         }] });
 class MockPageTitleComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockPageTitleComponent, isStandalone: true, selector: "kirby-page-title", host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockPageTitleComponent, isStandalone: true, selector: "kirby-page-title", host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: PageTitleComponent,
                 useExisting: forwardRef((() => MockPageTitleComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageTitleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageTitleComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-page-title',
@@ -1751,15 +1752,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 }]
         }] });
 class MockPageContentComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockPageContentComponent, isStandalone: true, selector: "kirby-page-content", host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockPageContentComponent, isStandalone: true, selector: "kirby-page-content", host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: PageContentComponent,
                 useExisting: forwardRef((() => MockPageContentComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageContentComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageContentComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-page-content',
@@ -1774,15 +1775,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 }]
         }] });
 class MockPageActionsComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockPageActionsComponent, isStandalone: true, selector: "kirby-page-actions", host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockPageActionsComponent, isStandalone: true, selector: "kirby-page-actions", host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: PageActionsComponent,
                 useExisting: forwardRef((() => MockPageActionsComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageActionsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageActionsComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-page-actions',
@@ -1803,15 +1804,15 @@ class MockPageComponent {
         this.refresh = new EventEmitter();
         this.backButtonClick = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockPageComponent, isStandalone: true, selector: "kirby-page", inputs: { title: "title", subtitle: "subtitle", toolbarTitle: "toolbarTitle", titleAlignment: "titleAlignment", defaultBackHref: "defaultBackHref", hideBackButton: "hideBackButton", titleMaxLines: "titleMaxLines", maxWidth: "maxWidth", tabBarBottomHidden: "tabBarBottomHidden" }, outputs: { enter: "enter", leave: "leave", refresh: "refresh", backButtonClick: "backButtonClick" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockPageComponent, isStandalone: true, selector: "kirby-page", inputs: { title: "title", subtitle: "subtitle", toolbarTitle: "toolbarTitle", titleAlignment: "titleAlignment", defaultBackHref: "defaultBackHref", hideBackButton: "hideBackButton", titleMaxLines: "titleMaxLines", maxWidth: "maxWidth", tabBarBottomHidden: "tabBarBottomHidden" }, outputs: { enter: "enter", leave: "leave", refresh: "refresh", backButtonClick: "backButtonClick" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: PageComponent,
                 useExisting: forwardRef((() => MockPageComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPageComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-page',
@@ -1857,15 +1858,21 @@ class MockPopoverComponent {
     constructor() {
         this.willHide = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPopoverComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockPopoverComponent, isStandalone: true, selector: "kirby-popover", inputs: { popout: "popout", target: "target" }, outputs: { willHide: "willHide" }, host: { attributes: { "mock": "mock" } }, providers: [
+    hide() {
+        // NOOP
+    }
+    show() {
+        // NOOP
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPopoverComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockPopoverComponent, isStandalone: true, selector: "kirby-popover", inputs: { popout: "popout", target: "target" }, outputs: { willHide: "willHide" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: PopoverComponent,
                 useExisting: forwardRef((() => MockPopoverComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPopoverComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPopoverComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-popover',
@@ -1888,15 +1895,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockProgressCircleRingComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockProgressCircleRingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockProgressCircleRingComponent, isStandalone: true, selector: "kirby-progress-circle-ring", inputs: { radius: "radius", value: "value", themeColor: "themeColor", strokeWidth: "strokeWidth", upperBound: "upperBound" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockProgressCircleRingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockProgressCircleRingComponent, isStandalone: true, selector: "kirby-progress-circle-ring", inputs: { radius: "radius", value: "value", themeColor: "themeColor", strokeWidth: "strokeWidth", upperBound: "upperBound" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ProgressCircleRingComponent,
                 useExisting: forwardRef((() => MockProgressCircleRingComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockProgressCircleRingComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockProgressCircleRingComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-progress-circle-ring',
@@ -1923,15 +1930,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockProgressCircleComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockProgressCircleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockProgressCircleComponent, isStandalone: true, selector: "kirby-progress-circle", inputs: { value: "value", size: "size", themeColor: "themeColor" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockProgressCircleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockProgressCircleComponent, isStandalone: true, selector: "kirby-progress-circle", inputs: { value: "value", size: "size", themeColor: "themeColor" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ProgressCircleComponent,
                 useExisting: forwardRef((() => MockProgressCircleComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockProgressCircleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockProgressCircleComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-progress-circle',
@@ -1957,15 +1964,15 @@ class MockRadioGroupComponent {
     constructor() {
         this.valueChange = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockRadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockRadioGroupComponent, isStandalone: true, selector: "kirby-radio-group", inputs: { disabled: "disabled", hasError: "hasError", items: "items", itemTextProperty: "itemTextProperty", itemDisabledProperty: "itemDisabledProperty", selectedIndex: "selectedIndex", value: "value" }, outputs: { valueChange: "valueChange" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockRadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockRadioGroupComponent, isStandalone: true, selector: "kirby-radio-group", inputs: { disabled: "disabled", hasError: "hasError", items: "items", itemTextProperty: "itemTextProperty", itemDisabledProperty: "itemDisabledProperty", selectedIndex: "selectedIndex", value: "value" }, outputs: { valueChange: "valueChange" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: RadioGroupComponent,
                 useExisting: forwardRef((() => MockRadioGroupComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockRadioGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockRadioGroupComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-radio-group',
@@ -1998,15 +2005,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockRadioComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockRadioComponent, isStandalone: true, selector: "kirby-radio", inputs: { value: "value", text: "text", size: "size", disabled: "disabled" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockRadioComponent, isStandalone: true, selector: "kirby-radio", inputs: { value: "value", text: "text", size: "size", disabled: "disabled" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: RadioComponent,
                 useExisting: forwardRef((() => MockRadioComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockRadioComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockRadioComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-radio',
@@ -2046,15 +2053,15 @@ class MockRangeComponent {
     registerOnChange() {
         // NOOP
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockRangeComponent, isStandalone: true, selector: "kirby-range", inputs: { minLabel: "minLabel", maxLabel: "maxLabel", debounce: "debounce", max: "max", min: "min", pin: "pin", step: "step", ticks: "ticks", disabled: "disabled", value: "value" }, outputs: { change: "change" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockRangeComponent, isStandalone: true, selector: "kirby-range", inputs: { minLabel: "minLabel", maxLabel: "maxLabel", debounce: "debounce", max: "max", min: "min", pin: "pin", step: "step", ticks: "ticks", disabled: "disabled", value: "value" }, outputs: { change: "change" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: RangeComponent,
                 useExisting: forwardRef((() => MockRangeComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockRangeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockRangeComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-range',
@@ -2097,15 +2104,15 @@ class MockReorderListComponent {
         this.itemReorder = new EventEmitter();
         this.subItemReorder = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockReorderListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockReorderListComponent, isStandalone: true, selector: "kirby-reorder-list", inputs: { items: "items", subItemsName: "subItemsName", getItemTextDefault: "getItemTextDefault" }, outputs: { itemReorder: "itemReorder", subItemReorder: "subItemReorder" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockReorderListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockReorderListComponent, isStandalone: true, selector: "kirby-reorder-list", inputs: { items: "items", subItemsName: "subItemsName", getItemTextDefault: "getItemTextDefault" }, outputs: { itemReorder: "itemReorder", subItemReorder: "subItemReorder" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ReorderListComponent,
                 useExisting: forwardRef((() => MockReorderListComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockReorderListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockReorderListComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-reorder-list',
@@ -2132,15 +2139,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockRouterOutletComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockRouterOutletComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockRouterOutletComponent, isStandalone: true, selector: "kirby-router-outlet", inputs: { main: "main" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockRouterOutletComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockRouterOutletComponent, isStandalone: true, selector: "kirby-router-outlet", inputs: { main: "main" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: RouterOutletComponent,
                 useExisting: forwardRef((() => MockRouterOutletComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockRouterOutletComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockRouterOutletComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-router-outlet',
@@ -2159,15 +2166,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockSectionHeaderComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockSectionHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockSectionHeaderComponent, isStandalone: true, selector: "kirby-section-header", host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockSectionHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockSectionHeaderComponent, isStandalone: true, selector: "kirby-section-header", host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: SectionHeaderComponent,
                 useExisting: forwardRef((() => MockSectionHeaderComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockSectionHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockSectionHeaderComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-section-header',
@@ -2190,15 +2197,15 @@ class MockSlidesComponent {
     slideTo() {
         // NOOP
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockSlidesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockSlidesComponent, isStandalone: true, selector: "kirby-slides", inputs: { slidesOptions: "slidesOptions", slides: "slides" }, outputs: { selectedSlide: "selectedSlide" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockSlidesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockSlidesComponent, isStandalone: true, selector: "kirby-slides", inputs: { slidesOptions: "slidesOptions", slides: "slides" }, outputs: { selectedSlide: "selectedSlide" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: SlidesComponent,
                 useExisting: forwardRef((() => MockSlidesComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockSlidesComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockSlidesComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-slides',
@@ -2225,15 +2232,15 @@ class MockSlideButtonComponent {
         this.slideDone = new EventEmitter();
         this.slidingPercentageChanged = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockSlideButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockSlideButtonComponent, isStandalone: true, selector: "kirby-slide-button", inputs: { text: "text", expand: "expand" }, outputs: { slideDone: "slideDone", slidingPercentageChanged: "slidingPercentageChanged" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockSlideButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockSlideButtonComponent, isStandalone: true, selector: "kirby-slide-button", inputs: { text: "text", expand: "expand" }, outputs: { slideDone: "slideDone", slidingPercentageChanged: "slidingPercentageChanged" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: SlideButtonComponent,
                 useExisting: forwardRef((() => MockSlideButtonComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockSlideButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockSlideButtonComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-slide-button',
@@ -2258,15 +2265,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockSpinnerComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockSpinnerComponent, isStandalone: true, selector: "kirby-spinner", host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockSpinnerComponent, isStandalone: true, selector: "kirby-spinner", host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: SpinnerComponent,
                 useExisting: forwardRef((() => MockSpinnerComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockSpinnerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockSpinnerComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-spinner',
@@ -2287,15 +2294,15 @@ class MockSegmentedControlComponent {
         this.selectedIndexChange = new EventEmitter();
         this.segmentSelect = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockSegmentedControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockSegmentedControlComponent, isStandalone: true, selector: "kirby-segmented-control", inputs: { mode: "mode", items: "items", selectedIndex: "selectedIndex", value: "value", size: "size", disableChangeOnSwipe: "disableChangeOnSwipe" }, outputs: { selectedIndexChange: "selectedIndexChange", segmentSelect: "segmentSelect" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockSegmentedControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockSegmentedControlComponent, isStandalone: true, selector: "kirby-segmented-control", inputs: { mode: "mode", items: "items", selectedIndex: "selectedIndex", value: "value", size: "size", disableChangeOnSwipe: "disableChangeOnSwipe" }, outputs: { selectedIndexChange: "selectedIndexChange", segmentSelect: "segmentSelect" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: SegmentedControlComponent,
                 useExisting: forwardRef((() => MockSegmentedControlComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockSegmentedControlComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockSegmentedControlComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-segmented-control',
@@ -2331,15 +2338,15 @@ class MockTabNavigationComponent {
     constructor() {
         this.selectedIndexChange = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockTabNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockTabNavigationComponent, isStandalone: true, selector: "kirby-tab-navigation", outputs: { selectedIndexChange: "selectedIndexChange" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockTabNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockTabNavigationComponent, isStandalone: true, selector: "kirby-tab-navigation", outputs: { selectedIndexChange: "selectedIndexChange" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: TabNavigationComponent,
                 useExisting: forwardRef((() => MockTabNavigationComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockTabNavigationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockTabNavigationComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-tab-navigation',
@@ -2358,15 +2365,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockTabNavigationItemComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockTabNavigationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockTabNavigationItemComponent, isStandalone: true, selector: "kirby-tab-navigation-item", inputs: { label: "label" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockTabNavigationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockTabNavigationItemComponent, isStandalone: true, selector: "kirby-tab-navigation-item", inputs: { label: "label" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: TabNavigationItemComponent,
                 useExisting: forwardRef((() => MockTabNavigationItemComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockTabNavigationItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockTabNavigationItemComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-tab-navigation-item',
@@ -2388,15 +2395,15 @@ class MockTabButtonComponent {
     constructor() {
         this.click = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockTabButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockTabButtonComponent, isStandalone: true, selector: "kirby-tab-button", inputs: { tab: "tab" }, outputs: { click: "click" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockTabButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockTabButtonComponent, isStandalone: true, selector: "kirby-tab-button", inputs: { tab: "tab" }, outputs: { click: "click" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: TabButtonComponent,
                 useExisting: forwardRef((() => MockTabButtonComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockTabButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockTabButtonComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-tab-button',
@@ -2417,15 +2424,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockTabsComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockTabsComponent, isStandalone: true, selector: "kirby-tab-bar", host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockTabsComponent, isStandalone: true, selector: "kirby-tab-bar", host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: TabsComponent,
                 useExisting: forwardRef((() => MockTabsComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockTabsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockTabsComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-tab-bar',
@@ -2445,15 +2452,15 @@ class MockToggleComponent {
     constructor() {
         this.checkedChange = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockToggleComponent, isStandalone: true, selector: "kirby-toggle", inputs: { checked: "checked", disabled: "disabled" }, outputs: { checkedChange: "checkedChange" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockToggleComponent, isStandalone: true, selector: "kirby-toggle", inputs: { checked: "checked", disabled: "disabled" }, outputs: { checkedChange: "checkedChange" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ToggleComponent,
                 useExisting: forwardRef((() => MockToggleComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockToggleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockToggleComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-toggle',
@@ -2479,15 +2486,15 @@ class MockToggleButtonComponent {
     constructor() {
         this.checkChanged = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockToggleButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: MockToggleButtonComponent, isStandalone: true, selector: "kirby-toggle-button", inputs: { checked: "checked" }, outputs: { checkChanged: "checkChanged" }, host: { attributes: { "mock": "mock" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockToggleButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: MockToggleButtonComponent, isStandalone: true, selector: "kirby-toggle-button", inputs: { checked: "checked" }, outputs: { checkChanged: "checkChanged" }, host: { attributes: { "mock": "mock" } }, providers: [
             {
                 provide: ToggleButtonComponent,
                 useExisting: forwardRef((() => MockToggleButtonComponent)),
             },
         ], ngImport: i0, template: '<ng-content></ng-content>', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockToggleButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockToggleButtonComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kirby-toggle-button',
@@ -2510,15 +2517,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockAccordionDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockAccordionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockAccordionDirective, isStandalone: true, selector: "[kirbyAccordion], kirby-accordion", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockAccordionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockAccordionDirective, isStandalone: true, selector: "[kirbyAccordion], kirby-accordion", providers: [
             {
                 provide: AccordionDirective,
                 useExisting: forwardRef((() => MockAccordionDirective)),
             },
         ], exportAs: ["kirby-accordion"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockAccordionDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockAccordionDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyAccordion], kirby-accordion',
@@ -2534,15 +2541,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockCardAsButtonDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockCardAsButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockCardAsButtonDirective, isStandalone: true, selector: "kirby-card[click]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockCardAsButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockCardAsButtonDirective, isStandalone: true, selector: "kirby-card[click]", providers: [
             {
                 provide: CardAsButtonDirective,
                 useExisting: forwardRef((() => MockCardAsButtonDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockCardAsButtonDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockCardAsButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -2558,15 +2565,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockAffixDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockAffixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockAffixDirective, isStandalone: true, selector: "[kirby-affix]", inputs: { type: ["kirby-affix", "type"] }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockAffixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockAffixDirective, isStandalone: true, selector: "[kirby-affix]", inputs: { type: ["kirby-affix", "type"] }, providers: [
             {
                 provide: AffixDirective,
                 useExisting: forwardRef((() => MockAffixDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockAffixDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockAffixDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -2585,15 +2592,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockDateInputDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockDateInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockDateInputDirective, isStandalone: true, selector: "[kirby-input][type=\"date\"]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockDateInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockDateInputDirective, isStandalone: true, selector: "[kirby-input][type=\"date\"]", providers: [
             {
                 provide: DateInputDirective,
                 useExisting: forwardRef((() => MockDateInputDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockDateInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockDateInputDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -2609,15 +2616,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockDecimalMaskDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockDecimalMaskDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockDecimalMaskDirective, isStandalone: true, selector: "[kirby-decimal-mask]", inputs: { min: "min", max: "max", precision: "precision", setMaxOnOverflow: "setMaxOnOverflow", allowMinus: "allowMinus", disableGroupSeperator: "disableGroupSeperator", maxlength: "maxlength" }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockDecimalMaskDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockDecimalMaskDirective, isStandalone: true, selector: "[kirby-decimal-mask]", inputs: { min: "min", max: "max", precision: "precision", setMaxOnOverflow: "setMaxOnOverflow", allowMinus: "allowMinus", disableGroupSeperator: "disableGroupSeperator", maxlength: "maxlength" }, providers: [
             {
                 provide: DecimalMaskDirective,
                 useExisting: forwardRef((() => MockDecimalMaskDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockDecimalMaskDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockDecimalMaskDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -2650,15 +2657,15 @@ class MockInfiniteScrollDirective {
     constructor() {
         this.scrollEnd = new EventEmitter();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockInfiniteScrollDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockInfiniteScrollDirective, isStandalone: true, selector: "[kirbyInfiniteScroll]", inputs: { disabled: "disabled" }, outputs: { scrollEnd: "scrollEnd" }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockInfiniteScrollDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockInfiniteScrollDirective, isStandalone: true, selector: "[kirbyInfiniteScroll]", inputs: { disabled: "disabled" }, outputs: { scrollEnd: "scrollEnd" }, providers: [
             {
                 provide: InfiniteScrollDirective,
                 useExisting: forwardRef((() => MockInfiniteScrollDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockInfiniteScrollDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockInfiniteScrollDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyInfiniteScroll]',
@@ -2677,15 +2684,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockListItemColorDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListItemColorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockListItemColorDirective, isStandalone: true, selector: "[kirbyListItemColor]", inputs: { kirbyListItemColor: "kirbyListItemColor", item: "item" }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListItemColorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockListItemColorDirective, isStandalone: true, selector: "[kirbyListItemColor]", inputs: { kirbyListItemColor: "kirbyListItemColor", item: "item" }, providers: [
             {
                 provide: ListItemColorDirective,
                 useExisting: forwardRef((() => MockListItemColorDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListItemColorDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListItemColorDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyListItemColor]',
@@ -2704,15 +2711,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockListItemTemplateDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListItemTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockListItemTemplateDirective, isStandalone: true, selector: "[kirbyListItemTemplate]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListItemTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockListItemTemplateDirective, isStandalone: true, selector: "[kirbyListItemTemplate]", providers: [
             {
                 provide: ListItemTemplateDirective,
                 useExisting: forwardRef((() => MockListItemTemplateDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListItemTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListItemTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyListItemTemplate]',
@@ -2725,15 +2732,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 }]
         }] });
 class MockListHeaderDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockListHeaderDirective, isStandalone: true, selector: "[kirbyListHeader], [kirbyListHeaderTemplate]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockListHeaderDirective, isStandalone: true, selector: "[kirbyListHeader], [kirbyListHeaderTemplate]", providers: [
             {
                 provide: ListHeaderDirective,
                 useExisting: forwardRef((() => MockListHeaderDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListHeaderDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListHeaderDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyListHeader], [kirbyListHeaderTemplate]',
@@ -2746,15 +2753,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 }]
         }] });
 class MockListSectionHeaderDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListSectionHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockListSectionHeaderDirective, isStandalone: true, selector: "[kirbyListSectionHeader], [kirbyListSectionHeaderTemplate]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListSectionHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockListSectionHeaderDirective, isStandalone: true, selector: "[kirbyListSectionHeader], [kirbyListSectionHeaderTemplate]", providers: [
             {
                 provide: ListSectionHeaderDirective,
                 useExisting: forwardRef((() => MockListSectionHeaderDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListSectionHeaderDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListSectionHeaderDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyListSectionHeader], [kirbyListSectionHeaderTemplate]',
@@ -2767,15 +2774,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 }]
         }] });
 class MockListFooterDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListFooterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockListFooterDirective, isStandalone: true, selector: "[kirbyListFooter], [kirbyListFooterTemplate]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListFooterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockListFooterDirective, isStandalone: true, selector: "[kirbyListFooter], [kirbyListFooterTemplate]", providers: [
             {
                 provide: ListFooterDirective,
                 useExisting: forwardRef((() => MockListFooterDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockListFooterDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockListFooterDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyListFooter], [kirbyListFooterTemplate]',
@@ -2805,15 +2812,15 @@ class MockFloatingDirective {
     toggleShow() {
         // NOOP
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockFloatingDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockFloatingDirective, isStandalone: true, selector: "[kirbyFloating]", inputs: { reference: "reference", placement: "placement", strategy: "strategy", triggers: "triggers", DOMPortalOutlet: "DOMPortalOutlet", portalOutletConfig: "portalOutletConfig", isDisabled: "isDisabled", offset: "offset", shift: "shift", autoPlacement: "autoPlacement", closeOnSelect: "closeOnSelect", closeOnEscapeKey: "closeOnEscapeKey", closeOnBackdrop: "closeOnBackdrop" }, outputs: { displayChanged: "displayChanged" }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockFloatingDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockFloatingDirective, isStandalone: true, selector: "[kirbyFloating]", inputs: { reference: "reference", placement: "placement", strategy: "strategy", triggers: "triggers", DOMPortalOutlet: "DOMPortalOutlet", portalOutletConfig: "portalOutletConfig", isDisabled: "isDisabled", offset: "offset", shift: "shift", autoPlacement: "autoPlacement", closeOnSelect: "closeOnSelect", closeOnEscapeKey: "closeOnEscapeKey", closeOnBackdrop: "closeOnBackdrop" }, outputs: { displayChanged: "displayChanged" }, providers: [
             {
                 provide: FloatingDirective,
                 useExisting: forwardRef((() => MockFloatingDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockFloatingDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockFloatingDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyFloating]',
@@ -2856,15 +2863,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockPortalDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPortalDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockPortalDirective, isStandalone: true, selector: "[kirbyPortal]", inputs: { outlet: "outlet" }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPortalDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockPortalDirective, isStandalone: true, selector: "[kirbyPortal]", inputs: { outlet: "outlet" }, providers: [
             {
                 provide: PortalDirective,
                 useExisting: forwardRef((() => MockPortalDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockPortalDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockPortalDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyPortal]',
@@ -2881,15 +2888,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockComponentLoaderDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockComponentLoaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockComponentLoaderDirective, isStandalone: true, selector: "[kirbyLoadComponent]", inputs: { configuration: ["kirbyLoadComponent", "configuration"], cssClass: "cssClass" }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockComponentLoaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockComponentLoaderDirective, isStandalone: true, selector: "[kirbyLoadComponent]", inputs: { configuration: ["kirbyLoadComponent", "configuration"], cssClass: "cssClass" }, providers: [
             {
                 provide: ComponentLoaderDirective,
                 useExisting: forwardRef((() => MockComponentLoaderDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockComponentLoaderDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockComponentLoaderDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyLoadComponent]',
@@ -2909,15 +2916,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockFitHeadingDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockFitHeadingDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockFitHeadingDirective, isStandalone: true, selector: "h1[kirbyFitHeading],h2[kirbyFitHeading],h3[kirbyFitHeading]", inputs: { config: ["kirbyFitHeading", "config"] }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockFitHeadingDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockFitHeadingDirective, isStandalone: true, selector: "h1[kirbyFitHeading],h2[kirbyFitHeading],h3[kirbyFitHeading]", inputs: { config: ["kirbyFitHeading", "config"] }, providers: [
             {
                 provide: FitHeadingDirective,
                 useExisting: forwardRef((() => MockFitHeadingDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockFitHeadingDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockFitHeadingDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -2936,15 +2943,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockThemeColorDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockThemeColorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockThemeColorDirective, isStandalone: true, selector: "kirby-avatar[themeColor],\n             kirby-card[themeColor],\n             kirby-icon[themeColor],\n             kirby-progress-circle-ring[themeColor],\n             kirby-modal-footer[themeColor],\n             kirby-empty-state[themeColor]", inputs: { themeColor: "themeColor" }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockThemeColorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockThemeColorDirective, isStandalone: true, selector: "kirby-avatar[themeColor],\n             kirby-card[themeColor],\n             kirby-icon[themeColor],\n             kirby-progress-circle-ring[themeColor],\n             kirby-modal-footer[themeColor],\n             kirby-empty-state[themeColor]", inputs: { themeColor: "themeColor" }, providers: [
             {
                 provide: ThemeColorDirective,
                 useExisting: forwardRef((() => MockThemeColorDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockThemeColorDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockThemeColorDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -2967,15 +2974,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockSlideDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockSlideDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockSlideDirective, isStandalone: true, selector: "[kirbySlide]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockSlideDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockSlideDirective, isStandalone: true, selector: "[kirbySlide]", providers: [
             {
                 provide: SlideDirective,
                 useExisting: forwardRef((() => MockSlideDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockSlideDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockSlideDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbySlide]',
@@ -2990,15 +2997,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockKeyHandlerDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockKeyHandlerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockKeyHandlerDirective, isStandalone: true, selector: "[keyHandler]", providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockKeyHandlerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockKeyHandlerDirective, isStandalone: true, selector: "[keyHandler]", providers: [
             {
                 provide: KeyHandlerDirective,
                 useExisting: forwardRef((() => MockKeyHandlerDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockKeyHandlerDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockKeyHandlerDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -3014,15 +3021,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 // #region AUTO-GENERATED - PLEASE DON'T EDIT CONTENT WITHIN!
 class MockModalRouterLinkDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockModalRouterLinkDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.15", type: MockModalRouterLinkDirective, isStandalone: true, selector: "[kirbyModalRouterLink]", inputs: { path: ["kirbyModalRouterLink", "path"], queryParams: ["kirbyModalQueryParams", "queryParams"] }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockModalRouterLinkDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: MockModalRouterLinkDirective, isStandalone: true, selector: "[kirbyModalRouterLink]", inputs: { path: ["kirbyModalRouterLink", "path"], queryParams: ["kirbyModalQueryParams", "queryParams"] }, providers: [
             {
                 provide: ModalRouterLinkDirective,
                 useExisting: forwardRef((() => MockModalRouterLinkDirective)),
             },
         ], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MockModalRouterLinkDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MockModalRouterLinkDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -3147,11 +3154,11 @@ const MOCK_DIRECTIVES = [
 ];
 
 class KirbyTestingBaseModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: KirbyTestingBaseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: KirbyTestingBaseModule, imports: [MockAccordionItemComponent, MockActionGroupComponent, MockAvatarComponent, MockButtonComponent, MockCalendarComponent, MockCardFooterComponent, MockCardHeaderComponent, MockCardComponent, MockChartComponent, MockBaseChartComponent, MockStockChartComponent, MockCheckboxComponent, MockDividerComponent, MockDropdownComponent, MockEmptyStateComponent, MockFabSheetComponent, MockFlagComponent, MockFormFieldMessageComponent, MockFormFieldComponent, MockInputComponent, MockInputCounterComponent, MockTextareaComponent, MockHeaderActionsDirective, MockHeaderCustomSectionDirective, MockHeaderComponent, MockIconComponent, MockItemComponent, MockLabelComponent, MockItemGroupComponent, MockItemSlidingComponent, MockAppComponent, MockListExperimentalComponent, MockListHeaderComponent, MockListItemComponent, MockListSectionHeaderComponent, MockListComponent, MockLoadingOverlayComponent, MockMenuComponent, MockActionSheetComponent, MockAlertComponent, MockModalFooterComponent, MockModalCompactWrapperComponent, MockModalWrapperComponent, MockPageFooterComponent, MockPageTitleDirective, MockPageSubtitleDirective, MockPageToolbarTitleDirective, MockPageActionsDirective, MockPageContentDirective, MockPageStickyContentDirective, MockPageProgressComponent, MockPageTitleComponent, MockPageContentComponent, MockPageActionsComponent, MockPageComponent, MockPopoverComponent, MockProgressCircleRingComponent, MockProgressCircleComponent, MockRadioGroupComponent, MockRadioComponent, MockRangeComponent, MockReorderListComponent, MockRouterOutletComponent, MockSectionHeaderComponent, MockSlidesComponent, MockSlideButtonComponent, MockSpinnerComponent, MockSegmentedControlComponent, MockBadgeComponent, MockTabNavigationComponent, MockTabNavigationItemComponent, MockTabButtonComponent, MockTabsComponent, MockToggleComponent, MockToggleButtonComponent, MockAccordionDirective, MockCardAsButtonDirective, MockAffixDirective, MockDateInputDirective, MockDecimalMaskDirective, MockInfiniteScrollDirective, MockListItemColorDirective, MockListItemTemplateDirective, MockListHeaderDirective, MockListSectionHeaderDirective, MockListFooterDirective, MockFloatingDirective, MockPortalDirective, MockComponentLoaderDirective, MockFitHeadingDirective, MockThemeColorDirective, MockSlideDirective, MockKeyHandlerDirective, MockModalRouterLinkDirective], exports: [MockAccordionItemComponent, MockActionGroupComponent, MockAvatarComponent, MockButtonComponent, MockCalendarComponent, MockCardFooterComponent, MockCardHeaderComponent, MockCardComponent, MockChartComponent, MockBaseChartComponent, MockStockChartComponent, MockCheckboxComponent, MockDividerComponent, MockDropdownComponent, MockEmptyStateComponent, MockFabSheetComponent, MockFlagComponent, MockFormFieldMessageComponent, MockFormFieldComponent, MockInputComponent, MockInputCounterComponent, MockTextareaComponent, MockHeaderActionsDirective, MockHeaderCustomSectionDirective, MockHeaderComponent, MockIconComponent, MockItemComponent, MockLabelComponent, MockItemGroupComponent, MockItemSlidingComponent, MockAppComponent, MockListExperimentalComponent, MockListHeaderComponent, MockListItemComponent, MockListSectionHeaderComponent, MockListComponent, MockLoadingOverlayComponent, MockMenuComponent, MockActionSheetComponent, MockAlertComponent, MockModalFooterComponent, MockModalCompactWrapperComponent, MockModalWrapperComponent, MockPageFooterComponent, MockPageTitleDirective, MockPageSubtitleDirective, MockPageToolbarTitleDirective, MockPageActionsDirective, MockPageContentDirective, MockPageStickyContentDirective, MockPageProgressComponent, MockPageTitleComponent, MockPageContentComponent, MockPageActionsComponent, MockPageComponent, MockPopoverComponent, MockProgressCircleRingComponent, MockProgressCircleComponent, MockRadioGroupComponent, MockRadioComponent, MockRangeComponent, MockReorderListComponent, MockRouterOutletComponent, MockSectionHeaderComponent, MockSlidesComponent, MockSlideButtonComponent, MockSpinnerComponent, MockSegmentedControlComponent, MockBadgeComponent, MockTabNavigationComponent, MockTabNavigationItemComponent, MockTabButtonComponent, MockTabsComponent, MockToggleComponent, MockToggleButtonComponent, MockAccordionDirective, MockCardAsButtonDirective, MockAffixDirective, MockDateInputDirective, MockDecimalMaskDirective, MockInfiniteScrollDirective, MockListItemColorDirective, MockListItemTemplateDirective, MockListHeaderDirective, MockListSectionHeaderDirective, MockListFooterDirective, MockFloatingDirective, MockPortalDirective, MockComponentLoaderDirective, MockFitHeadingDirective, MockThemeColorDirective, MockSlideDirective, MockKeyHandlerDirective, MockModalRouterLinkDirective] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: KirbyTestingBaseModule }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: KirbyTestingBaseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.6", ngImport: i0, type: KirbyTestingBaseModule, imports: [MockAccordionItemComponent, MockActionGroupComponent, MockAvatarComponent, MockButtonComponent, MockCalendarComponent, MockCardFooterComponent, MockCardHeaderComponent, MockCardComponent, MockChartComponent, MockBaseChartComponent, MockStockChartComponent, MockCheckboxComponent, MockDividerComponent, MockDropdownComponent, MockEmptyStateComponent, MockFabSheetComponent, MockFlagComponent, MockFormFieldMessageComponent, MockFormFieldComponent, MockInputComponent, MockInputCounterComponent, MockTextareaComponent, MockHeaderActionsDirective, MockHeaderCustomSectionDirective, MockHeaderComponent, MockIconComponent, MockItemComponent, MockLabelComponent, MockItemGroupComponent, MockItemSlidingComponent, MockAppComponent, MockListExperimentalComponent, MockListHeaderComponent, MockListItemComponent, MockListSectionHeaderComponent, MockListComponent, MockLoadingOverlayComponent, MockMenuComponent, MockActionSheetComponent, MockAlertComponent, MockModalFooterComponent, MockModalCompactWrapperComponent, MockModalWrapperComponent, MockPageFooterComponent, MockPageTitleDirective, MockPageSubtitleDirective, MockPageToolbarTitleDirective, MockPageActionsDirective, MockPageContentDirective, MockPageStickyContentDirective, MockPageProgressComponent, MockPageTitleComponent, MockPageContentComponent, MockPageActionsComponent, MockPageComponent, MockPopoverComponent, MockProgressCircleRingComponent, MockProgressCircleComponent, MockRadioGroupComponent, MockRadioComponent, MockRangeComponent, MockReorderListComponent, MockRouterOutletComponent, MockSectionHeaderComponent, MockSlidesComponent, MockSlideButtonComponent, MockSpinnerComponent, MockSegmentedControlComponent, MockBadgeComponent, MockTabNavigationComponent, MockTabNavigationItemComponent, MockTabButtonComponent, MockTabsComponent, MockToggleComponent, MockToggleButtonComponent, MockAccordionDirective, MockCardAsButtonDirective, MockAffixDirective, MockDateInputDirective, MockDecimalMaskDirective, MockInfiniteScrollDirective, MockListItemColorDirective, MockListItemTemplateDirective, MockListHeaderDirective, MockListSectionHeaderDirective, MockListFooterDirective, MockFloatingDirective, MockPortalDirective, MockComponentLoaderDirective, MockFitHeadingDirective, MockThemeColorDirective, MockSlideDirective, MockKeyHandlerDirective, MockModalRouterLinkDirective], exports: [MockAccordionItemComponent, MockActionGroupComponent, MockAvatarComponent, MockButtonComponent, MockCalendarComponent, MockCardFooterComponent, MockCardHeaderComponent, MockCardComponent, MockChartComponent, MockBaseChartComponent, MockStockChartComponent, MockCheckboxComponent, MockDividerComponent, MockDropdownComponent, MockEmptyStateComponent, MockFabSheetComponent, MockFlagComponent, MockFormFieldMessageComponent, MockFormFieldComponent, MockInputComponent, MockInputCounterComponent, MockTextareaComponent, MockHeaderActionsDirective, MockHeaderCustomSectionDirective, MockHeaderComponent, MockIconComponent, MockItemComponent, MockLabelComponent, MockItemGroupComponent, MockItemSlidingComponent, MockAppComponent, MockListExperimentalComponent, MockListHeaderComponent, MockListItemComponent, MockListSectionHeaderComponent, MockListComponent, MockLoadingOverlayComponent, MockMenuComponent, MockActionSheetComponent, MockAlertComponent, MockModalFooterComponent, MockModalCompactWrapperComponent, MockModalWrapperComponent, MockPageFooterComponent, MockPageTitleDirective, MockPageSubtitleDirective, MockPageToolbarTitleDirective, MockPageActionsDirective, MockPageContentDirective, MockPageStickyContentDirective, MockPageProgressComponent, MockPageTitleComponent, MockPageContentComponent, MockPageActionsComponent, MockPageComponent, MockPopoverComponent, MockProgressCircleRingComponent, MockProgressCircleComponent, MockRadioGroupComponent, MockRadioComponent, MockRangeComponent, MockReorderListComponent, MockRouterOutletComponent, MockSectionHeaderComponent, MockSlidesComponent, MockSlideButtonComponent, MockSpinnerComponent, MockSegmentedControlComponent, MockBadgeComponent, MockTabNavigationComponent, MockTabNavigationItemComponent, MockTabButtonComponent, MockTabsComponent, MockToggleComponent, MockToggleButtonComponent, MockAccordionDirective, MockCardAsButtonDirective, MockAffixDirective, MockDateInputDirective, MockDecimalMaskDirective, MockInfiniteScrollDirective, MockListItemColorDirective, MockListItemTemplateDirective, MockListHeaderDirective, MockListSectionHeaderDirective, MockListFooterDirective, MockFloatingDirective, MockPortalDirective, MockComponentLoaderDirective, MockFitHeadingDirective, MockThemeColorDirective, MockSlideDirective, MockKeyHandlerDirective, MockModalRouterLinkDirective] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: KirbyTestingBaseModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: KirbyTestingBaseModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: KirbyTestingBaseModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [MOCK_COMPONENTS, MOCK_DIRECTIVES],