npm - @kirbydesign/designsystem - Versions diffs - 9.4.1 → 9.5.0 - Mend

@kirbydesign/designsystem 9.4.1 → 9.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (313) hide show

package/fesm2022/kirbydesign-designsystem-testing-jasmine.mjs CHANGED Viewed

@@ -88,15 +88,14 @@ const MOCK_PROVIDERS = [
     },
 ];
-/// <reference path='../../../../../node_modules/@types/jasmine/index.d.ts' />
 // eslint-disable-next-line @typescript-eslint/triple-slash-reference
 /// <reference path='../../../../../node_modules/@types/jasmine/index.d.ts' />
 class KirbyTestingModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KirbyTestingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: KirbyTestingModule, imports: [KirbyTestingBaseModule], exports: [KirbyTestingBaseModule] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KirbyTestingModule, providers: [...MOCK_PROVIDERS], imports: [KirbyTestingBaseModule, KirbyTestingBaseModule] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KirbyTestingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.9", ngImport: i0, type: KirbyTestingModule, imports: [KirbyTestingBaseModule], exports: [KirbyTestingBaseModule] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KirbyTestingModule, providers: [...MOCK_PROVIDERS], imports: [KirbyTestingBaseModule, KirbyTestingBaseModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KirbyTestingModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KirbyTestingModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [KirbyTestingBaseModule],

package/fesm2022/kirbydesign-designsystem-testing-jasmine.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"kirbydesign-designsystem-testing-jasmine.mjs","sources":["../../../../libs/designsystem/testing-jasmine/src/lib/mock-providers.ts","../../../../libs/designsystem/testing-jasmine/src/lib/kirby-testing.module.ts","../../../../libs/designsystem/testing-jasmine/src/kirbydesign-designsystem-testing-jasmine.ts"],"sourcesContent":["// AUTO-GENERATED - PLEASE DON'T EDIT THIS FILE MANUALLY\n\nimport {\n ChartConfigService,\n ChartJSService,\n IconRegistryService,\n LoadingOverlayService,\n TabsService,\n} from '@kirbydesign/designsystem';\n\nimport { ToastController } from '@kirbydesign/designsystem/toast';\nimport { ModalController } from '@kirbydesign/designsystem/modal';\n\nimport { EMPTY } from 'rxjs';\n\nexport function chartConfigServiceFactory() {\n return jasmine.createSpyObj<ChartConfigService>('ChartConfigService', [\n 'getTypeConfig',\n 'getAnnotationDefaults',\n 'chartTypeToChartJSType',\n 'applyInteractionFunctionsExtensions',\n 'getStockChartOptions',\n ]);\n}\n\nexport function chartJSServiceFactory() {\n return jasmine.createSpyObj<ChartJSService>('ChartJSService', [\n 'renderChart',\n 'redrawChart',\n 'destroyChart',\n 'updateData',\n 'updateLabels',\n 'updateType',\n 'updateOptions',\n 'updateAnnotations',\n 'updateHighlightedElements',\n ]);\n}\n\nexport function iconRegistryServiceFactory() {\n return jasmine.createSpyObj<IconRegistryService>('IconRegistryService', ['addIcon', 'addIcons']);\n}\n\nexport function loadingOverlayServiceFactory() {\n return jasmine.createSpyObj<LoadingOverlayService>('LoadingOverlayService', [\n 'showLoadingOverlay',\n 'hideLoadingOverlay',\n ]);\n}\n\nexport function modalControllerFactory() {\n return jasmine.createSpyObj<ModalController>('ModalController', [\n 'showModal',\n 'navigateToModal',\n 'navigateWithinModal',\n 'showActionSheet',\n 'showAlert',\n 'hideTopmost',\n 'hideAll',\n ]);\n}\n\nexport function tabsServiceFactory() {\n return jasmine.createSpyObj<TabsService>('TabsService', ['setOutlet', 'resetOutlet'], {\n outlet$: EMPTY,\n });\n}\n\nexport function toastControllerFactory() {\n return jasmine.createSpyObj<ToastController>('ToastController', ['showToast']);\n}\n\nexport const MOCK_PROVIDERS = [\n {\n provide: ChartConfigService,\n useFactory: chartConfigServiceFactory,\n },\n {\n provide: ChartJSService,\n useFactory: chartJSServiceFactory,\n },\n {\n provide: IconRegistryService,\n useFactory: iconRegistryServiceFactory,\n },\n {\n provide: LoadingOverlayService,\n useFactory: loadingOverlayServiceFactory,\n },\n {\n provide: ModalController,\n useFactory: modalControllerFactory,\n },\n {\n provide: TabsService,\n useFactory: tabsServiceFactory,\n },\n {\n provide: ToastController,\n useFactory: toastControllerFactory,\n },\n];\n","// eslint-disable-next-line @typescript-eslint/triple-slash-reference\n/// <reference path='../../../../../node_modules/@types/jasmine/index.d.ts' />\n\nimport { NgModule } from '@angular/core';\n\nimport { KirbyTestingBaseModule } from '@kirbydesign/designsystem/testing-base';\n\nimport { MOCK_PROVIDERS } from './mock-providers';\n\n@NgModule({\n imports: [KirbyTestingBaseModule],\n exports: [KirbyTestingBaseModule],\n providers: [...MOCK_PROVIDERS],\n})\nexport class KirbyTestingModule {}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public_api';\n"],"names":[],"mappings":";;;;;;;;AAAA;SAegB,yBAAyB,GAAA;AACvC,IAAA,OAAO,OAAO,CAAC,YAAY,CAAqB,oBAAoB,EAAE;QACpE,eAAe;QACf,uBAAuB;QACvB,wBAAwB;QACxB,qCAAqC;QACrC,sBAAsB;AACvB,KAAA,CAAC,CAAC;AACL,CAAC;SAEe,qBAAqB,GAAA;AACnC,IAAA,OAAO,OAAO,CAAC,YAAY,CAAiB,gBAAgB,EAAE;QAC5D,aAAa;QACb,aAAa;QACb,cAAc;QACd,YAAY;QACZ,cAAc;QACd,YAAY;QACZ,eAAe;QACf,mBAAmB;QACnB,2BAA2B;AAC5B,KAAA,CAAC,CAAC;AACL,CAAC;SAEe,0BAA0B,GAAA;AACxC,IAAA,OAAO,OAAO,CAAC,YAAY,CAAsB,qBAAqB,EAAE,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;AACnG,CAAC;SAEe,4BAA4B,GAAA;AAC1C,IAAA,OAAO,OAAO,CAAC,YAAY,CAAwB,uBAAuB,EAAE;QAC1E,oBAAoB;QACpB,oBAAoB;AACrB,KAAA,CAAC,CAAC;AACL,CAAC;SAEe,sBAAsB,GAAA;AACpC,IAAA,OAAO,OAAO,CAAC,YAAY,CAAkB,iBAAiB,EAAE;QAC9D,WAAW;QACX,iBAAiB;QACjB,qBAAqB;QACrB,iBAAiB;QACjB,WAAW;QACX,aAAa;QACb,SAAS;AACV,KAAA,CAAC,CAAC;AACL,CAAC;SAEe,kBAAkB,GAAA;IAChC,OAAO,OAAO,CAAC,YAAY,CAAc,aAAa,EAAE,CAAC,WAAW,EAAE,aAAa,CAAC,EAAE;AACpF,QAAA,OAAO,EAAE,KAAK;AACf,KAAA,CAAC,CAAC;AACL,CAAC;SAEe,sBAAsB,GAAA;IACpC,OAAO,OAAO,CAAC,YAAY,CAAkB,iBAAiB,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;AACjF,CAAC;AAEM,MAAM,cAAc,GAAG;AAC5B,IAAA;AACE,QAAA,OAAO,EAAE,kBAAkB;AAC3B,QAAA,UAAU,EAAE,yBAAyB;AACtC,KAAA;AACD,IAAA;AACE,QAAA,OAAO,EAAE,cAAc;AACvB,QAAA,UAAU,EAAE,qBAAqB;AAClC,KAAA;AACD,IAAA;AACE,QAAA,OAAO,EAAE,mBAAmB;AAC5B,QAAA,UAAU,EAAE,0BAA0B;AACvC,KAAA;AACD,IAAA;AACE,QAAA,OAAO,EAAE,qBAAqB;AAC9B,QAAA,UAAU,EAAE,4BAA4B;AACzC,KAAA;AACD,IAAA;AACE,QAAA,OAAO,EAAE,eAAe;AACxB,QAAA,UAAU,EAAE,sBAAsB;AACnC,KAAA;AACD,IAAA;AACE,QAAA,OAAO,EAAE,WAAW;AACpB,QAAA,UAAU,EAAE,kBAAkB;AAC/B,KAAA;AACD,IAAA;AACE,QAAA,OAAO,EAAE,eAAe;AACxB,QAAA,UAAU,EAAE,sBAAsB;AACnC,KAAA;CACF;;~~ACpGD~~;~~AADA;~~AACA;MAaa,kBAAkB,CAAA;iIAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;kIAAlB,kBAAkB,EAAA,OAAA,EAAA,CAJnB,sBAAsB,CAAA,EAAA,OAAA,EAAA,CACtB,sBAAsB,CAAA,EAAA,CAAA,CAAA,EAAA;kIAGrB,kBAAkB,EAAA,SAAA,EAFlB,CAAC,GAAG,cAAc,CAAC,EAFpB,OAAA,EAAA,CAAA,sBAAsB,EACtB,sBAAsB,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAGrB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAL9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,sBAAsB,CAAC;oBACjC,OAAO,EAAE,CAAC,sBAAsB,CAAC;AACjC,oBAAA,SAAS,EAAE,CAAC,GAAG,cAAc,CAAC;AAC/B,iBAAA,CAAA;;;ACbD;;AAEG;;;;"}
1	+ {"version":3,"file":"kirbydesign-designsystem-testing-jasmine.mjs","sources":["../../../../libs/designsystem/testing-jasmine/src/lib/mock-providers.ts","../../../../libs/designsystem/testing-jasmine/src/lib/kirby-testing.module.ts","../../../../libs/designsystem/testing-jasmine/src/kirbydesign-designsystem-testing-jasmine.ts"],"sourcesContent":["// AUTO-GENERATED - PLEASE DON'T EDIT THIS FILE MANUALLY\n\nimport {\n ChartConfigService,\n ChartJSService,\n IconRegistryService,\n LoadingOverlayService,\n TabsService,\n} from '@kirbydesign/designsystem';\n\nimport { ToastController } from '@kirbydesign/designsystem/toast';\nimport { ModalController } from '@kirbydesign/designsystem/modal';\n\nimport { EMPTY } from 'rxjs';\n\nexport function chartConfigServiceFactory() {\n return jasmine.createSpyObj<ChartConfigService>('ChartConfigService', [\n 'getTypeConfig',\n 'getAnnotationDefaults',\n 'chartTypeToChartJSType',\n 'applyInteractionFunctionsExtensions',\n 'getStockChartOptions',\n ]);\n}\n\nexport function chartJSServiceFactory() {\n return jasmine.createSpyObj<ChartJSService>('ChartJSService', [\n 'renderChart',\n 'redrawChart',\n 'destroyChart',\n 'updateData',\n 'updateLabels',\n 'updateType',\n 'updateOptions',\n 'updateAnnotations',\n 'updateHighlightedElements',\n ]);\n}\n\nexport function iconRegistryServiceFactory() {\n return jasmine.createSpyObj<IconRegistryService>('IconRegistryService', ['addIcon', 'addIcons']);\n}\n\nexport function loadingOverlayServiceFactory() {\n return jasmine.createSpyObj<LoadingOverlayService>('LoadingOverlayService', [\n 'showLoadingOverlay',\n 'hideLoadingOverlay',\n ]);\n}\n\nexport function modalControllerFactory() {\n return jasmine.createSpyObj<ModalController>('ModalController', [\n 'showModal',\n 'navigateToModal',\n 'navigateWithinModal',\n 'showActionSheet',\n 'showAlert',\n 'hideTopmost',\n 'hideAll',\n ]);\n}\n\nexport function tabsServiceFactory() {\n return jasmine.createSpyObj<TabsService>('TabsService', ['setOutlet', 'resetOutlet'], {\n outlet$: EMPTY,\n });\n}\n\nexport function toastControllerFactory() {\n return jasmine.createSpyObj<ToastController>('ToastController', ['showToast']);\n}\n\nexport const MOCK_PROVIDERS = [\n {\n provide: ChartConfigService,\n useFactory: chartConfigServiceFactory,\n },\n {\n provide: ChartJSService,\n useFactory: chartJSServiceFactory,\n },\n {\n provide: IconRegistryService,\n useFactory: iconRegistryServiceFactory,\n },\n {\n provide: LoadingOverlayService,\n useFactory: loadingOverlayServiceFactory,\n },\n {\n provide: ModalController,\n useFactory: modalControllerFactory,\n },\n {\n provide: TabsService,\n useFactory: tabsServiceFactory,\n },\n {\n provide: ToastController,\n useFactory: toastControllerFactory,\n },\n];\n","// eslint-disable-next-line @typescript-eslint/triple-slash-reference\n/// <reference path='../../../../../node_modules/@types/jasmine/index.d.ts' />\n\nimport { NgModule } from '@angular/core';\n\nimport { KirbyTestingBaseModule } from '@kirbydesign/designsystem/testing-base';\n\nimport { MOCK_PROVIDERS } from './mock-providers';\n\n@NgModule({\n imports: [KirbyTestingBaseModule],\n exports: [KirbyTestingBaseModule],\n providers: [...MOCK_PROVIDERS],\n})\nexport class KirbyTestingModule {}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/kirbydesign-designsystem-testing-jest.mjs CHANGED Viewed

@@ -94,15 +94,14 @@ const MOCK_PROVIDERS = [
     },
 ];
-/// <reference path='../../../../../node_modules/@types/jest/index.d.ts' />
 // eslint-disable-next-line @typescript-eslint/triple-slash-reference
 /// <reference path='../../../../../node_modules/@types/jest/index.d.ts' />
 class KirbyTestingModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KirbyTestingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: KirbyTestingModule, imports: [KirbyTestingBaseModule], exports: [KirbyTestingBaseModule] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KirbyTestingModule, providers: [...MOCK_PROVIDERS], imports: [KirbyTestingBaseModule, KirbyTestingBaseModule] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KirbyTestingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.9", ngImport: i0, type: KirbyTestingModule, imports: [KirbyTestingBaseModule], exports: [KirbyTestingBaseModule] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KirbyTestingModule, providers: [...MOCK_PROVIDERS], imports: [KirbyTestingBaseModule, KirbyTestingBaseModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KirbyTestingModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KirbyTestingModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [KirbyTestingBaseModule],

package/fesm2022/kirbydesign-designsystem-testing-jest.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"kirbydesign-designsystem-testing-jest.mjs","sources":["../../../../libs/designsystem/testing-jest/src/lib/mock-providers.ts","../../../../libs/designsystem/testing-jest/src/lib/kirby-testing.module.ts","../../../../libs/designsystem/testing-jest/src/kirbydesign-designsystem-testing-jest.ts"],"sourcesContent":["// AUTO-GENERATED - PLEASE DON'T EDIT THIS FILE MANUALLY\n\nimport {\n ChartConfigService,\n ChartJSService,\n IconRegistryService,\n LoadingOverlayService,\n ModalController,\n TabsService,\n} from '@kirbydesign/designsystem';\n\nimport { ToastController } from '@kirbydesign/designsystem/toast';\nimport { EMPTY } from 'rxjs';\n\nexport function chartConfigServiceFactory() {\n return {\n getTypeConfig: jest.fn(),\n getAnnotationDefaults: jest.fn(),\n chartTypeToChartJSType: jest.fn(),\n applyInteractionFunctionsExtensions: jest.fn(),\n getStockChartOptions: jest.fn(),\n };\n}\n\nexport function chartJSServiceFactory() {\n return {\n renderChart: jest.fn(),\n redrawChart: jest.fn(),\n destroyChart: jest.fn(),\n updateData: jest.fn(),\n updateLabels: jest.fn(),\n updateType: jest.fn(),\n updateOptions: jest.fn(),\n updateAnnotations: jest.fn(),\n updateHighlightedElements: jest.fn(),\n };\n}\n\nexport function iconRegistryServiceFactory() {\n return {\n addIcon: jest.fn(),\n addIcons: jest.fn(),\n };\n}\n\nexport function loadingOverlayServiceFactory() {\n return {\n showLoadingOverlay: jest.fn(),\n hideLoadingOverlay: jest.fn(),\n };\n}\n\nexport function modalControllerFactory() {\n return {\n showModal: jest.fn(),\n navigateToModal: jest.fn(),\n navigateWithinModal: jest.fn(),\n showActionSheet: jest.fn(),\n showAlert: jest.fn(),\n hideTopmost: jest.fn(),\n hideAll: jest.fn(),\n };\n}\n\nexport function tabsServiceFactory() {\n return {\n setOutlet: jest.fn(),\n resetOutlet: jest.fn(),\n outlet$: EMPTY,\n };\n}\n\nexport function toastControllerFactory() {\n return {\n showToast: jest.fn(),\n };\n}\n\nexport const MOCK_PROVIDERS = [\n {\n provide: ChartConfigService,\n useFactory: chartConfigServiceFactory,\n },\n {\n provide: ChartJSService,\n useFactory: chartJSServiceFactory,\n },\n {\n provide: IconRegistryService,\n useFactory: iconRegistryServiceFactory,\n },\n {\n provide: LoadingOverlayService,\n useFactory: loadingOverlayServiceFactory,\n },\n {\n provide: ModalController,\n useFactory: modalControllerFactory,\n },\n {\n provide: TabsService,\n useFactory: tabsServiceFactory,\n },\n {\n provide: ToastController,\n useFactory: toastControllerFactory,\n },\n];\n","// eslint-disable-next-line @typescript-eslint/triple-slash-reference\n/// <reference path='../../../../../node_modules/@types/jest/index.d.ts' />\n\nimport { NgModule } from '@angular/core';\n\nimport { KirbyTestingBaseModule } from '@kirbydesign/designsystem/testing-base';\n\nimport { MOCK_PROVIDERS } from './mock-providers';\n\n@NgModule({\n imports: [KirbyTestingBaseModule],\n exports: [KirbyTestingBaseModule],\n providers: [...MOCK_PROVIDERS],\n})\nexport class KirbyTestingModule {}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public_api';\n"],"names":[],"mappings":"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~~AC1GD~~;~~AADA;~~AACA;MAaa,kBAAkB,CAAA;iIAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;kIAAlB,kBAAkB,EAAA,OAAA,EAAA,CAJnB,sBAAsB,CAAA,EAAA,OAAA,EAAA,CACtB,sBAAsB,CAAA,EAAA,CAAA,CAAA,EAAA;kIAGrB,kBAAkB,EAAA,SAAA,EAFlB,CAAC,GAAG,cAAc,CAAC,EAFpB,OAAA,EAAA,CAAA,sBAAsB,EACtB,sBAAsB,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAGrB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAL9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,sBAAsB,CAAC;oBACjC,OAAO,EAAE,CAAC,sBAAsB,CAAC;AACjC,oBAAA,SAAS,EAAE,CAAC,GAAG,cAAc,CAAC;AAC/B,iBAAA,CAAA;;;ACbD;;AAEG;;;;"}
1	+ {"version":3,"file":"kirbydesign-designsystem-testing-jest.mjs","sources":["../../../../libs/designsystem/testing-jest/src/lib/mock-providers.ts","../../../../libs/designsystem/testing-jest/src/lib/kirby-testing.module.ts","../../../../libs/designsystem/testing-jest/src/kirbydesign-designsystem-testing-jest.ts"],"sourcesContent":["// AUTO-GENERATED - PLEASE DON'T EDIT THIS FILE MANUALLY\n\nimport {\n ChartConfigService,\n ChartJSService,\n IconRegistryService,\n LoadingOverlayService,\n ModalController,\n TabsService,\n} from '@kirbydesign/designsystem';\n\nimport { ToastController } from '@kirbydesign/designsystem/toast';\nimport { EMPTY } from 'rxjs';\n\nexport function chartConfigServiceFactory() {\n return {\n getTypeConfig: jest.fn(),\n getAnnotationDefaults: jest.fn(),\n chartTypeToChartJSType: jest.fn(),\n applyInteractionFunctionsExtensions: jest.fn(),\n getStockChartOptions: jest.fn(),\n };\n}\n\nexport function chartJSServiceFactory() {\n return {\n renderChart: jest.fn(),\n redrawChart: jest.fn(),\n destroyChart: jest.fn(),\n updateData: jest.fn(),\n updateLabels: jest.fn(),\n updateType: jest.fn(),\n updateOptions: jest.fn(),\n updateAnnotations: jest.fn(),\n updateHighlightedElements: jest.fn(),\n };\n}\n\nexport function iconRegistryServiceFactory() {\n return {\n addIcon: jest.fn(),\n addIcons: jest.fn(),\n };\n}\n\nexport function loadingOverlayServiceFactory() {\n return {\n showLoadingOverlay: jest.fn(),\n hideLoadingOverlay: jest.fn(),\n };\n}\n\nexport function modalControllerFactory() {\n return {\n showModal: jest.fn(),\n navigateToModal: jest.fn(),\n navigateWithinModal: jest.fn(),\n showActionSheet: jest.fn(),\n showAlert: jest.fn(),\n hideTopmost: jest.fn(),\n hideAll: jest.fn(),\n };\n}\n\nexport function tabsServiceFactory() {\n return {\n setOutlet: jest.fn(),\n resetOutlet: jest.fn(),\n outlet$: EMPTY,\n };\n}\n\nexport function toastControllerFactory() {\n return {\n showToast: jest.fn(),\n };\n}\n\nexport const MOCK_PROVIDERS = [\n {\n provide: ChartConfigService,\n useFactory: chartConfigServiceFactory,\n },\n {\n provide: ChartJSService,\n useFactory: chartJSServiceFactory,\n },\n {\n provide: IconRegistryService,\n useFactory: iconRegistryServiceFactory,\n },\n {\n provide: LoadingOverlayService,\n useFactory: loadingOverlayServiceFactory,\n },\n {\n provide: ModalController,\n useFactory: modalControllerFactory,\n },\n {\n provide: TabsService,\n useFactory: tabsServiceFactory,\n },\n {\n provide: ToastController,\n useFactory: toastControllerFactory,\n },\n];\n","// eslint-disable-next-line @typescript-eslint/triple-slash-reference\n/// <reference path='../../../../../node_modules/@types/jest/index.d.ts' />\n\nimport { NgModule } from '@angular/core';\n\nimport { KirbyTestingBaseModule } from '@kirbydesign/designsystem/testing-base';\n\nimport { MOCK_PROVIDERS } from './mock-providers';\n\n@NgModule({\n imports: [KirbyTestingBaseModule],\n exports: [KirbyTestingBaseModule],\n providers: [...MOCK_PROVIDERS],\n})\nexport class KirbyTestingModule {}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/kirbydesign-designsystem-testing.mjs CHANGED Viewed

@@ -5,11 +5,11 @@ import { provideIonicAngular } from '@ionic/angular/standalone';
 import { componentOnReady } from '@ionic/core';
 class IonicTestingModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: IonicTestingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: IonicTestingModule }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: IonicTestingModule, providers: [provideIonicAngular({ mode: 'ios', _testing: true })] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: IonicTestingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.9", ngImport: i0, type: IonicTestingModule }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: IonicTestingModule, providers: [provideIonicAngular({ mode: 'ios', _testing: true })] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: IonicTestingModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: IonicTestingModule, decorators: [{
             type: NgModule,
             args: [{
                     providers: [provideIonicAngular({ mode: 'ios', _testing: true })],

package/fesm2022/kirbydesign-designsystem-toast.mjs CHANGED Viewed

@@ -30,10 +30,10 @@ class ToastHelper {
         }
         return cssClass;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToastHelper, deps: [{ token: i1.ToastController }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToastHelper }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToastHelper, deps: [{ token: i1.ToastController }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToastHelper }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToastHelper, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToastHelper, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: i1.ToastController }] });
@@ -48,10 +48,10 @@ class ToastController {
             }
         });
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToastController, deps: [{ token: ToastHelper }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToastController }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToastController, deps: [{ token: ToastHelper }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToastController }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToastController, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToastController, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: ToastHelper }] });

package/fesm2022/kirbydesign-designsystem-toggle-button.mjs CHANGED Viewed

@@ -11,10 +11,10 @@ class ToggleButtonComponent {
         this.checked = !this.checked;
         this.checkChanged.emit(this.checked);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToggleButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: ToggleButtonComponent, selector: "kirby-toggle-button", inputs: { checked: "checked" }, outputs: { checkChanged: "checkChanged" }, host: { listeners: { "click": "onClick()" } }, ngImport: i0, template: "<ng-container *ngIf=\"!checked\">\n  <ng-content select=\"button[kirby-button][unchecked]\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"checked\">\n  <ng-content select=\"button[kirby-button][checked]\"></ng-content>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToggleButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.9", type: ToggleButtonComponent, selector: "kirby-toggle-button", inputs: { checked: "checked" }, outputs: { checkChanged: "checkChanged" }, host: { listeners: { "click": "onClick()" } }, ngImport: i0, template: "<ng-container *ngIf=\"!checked\">\n  <ng-content select=\"button[kirby-button][unchecked]\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"checked\">\n  <ng-content select=\"button[kirby-button][checked]\"></ng-content>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToggleButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToggleButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'kirby-toggle-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!checked\">\n  <ng-content select=\"button[kirby-button][unchecked]\"></ng-content>\n</ng-container>\n<ng-container *ngIf=\"checked\">\n  <ng-content select=\"button[kirby-button][checked]\"></ng-content>\n</ng-container>\n" }]
         }], propDecorators: { checked: [{
@@ -28,11 +28,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImpor
 const DECLARATIONS = [ToggleButtonComponent];
 class ToggleButtonModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToggleButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: ToggleButtonModule, declarations: [ToggleButtonComponent], imports: [CommonModule], exports: [ToggleButtonComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToggleButtonModule, imports: [CommonModule] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToggleButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.9", ngImport: i0, type: ToggleButtonModule, declarations: [ToggleButtonComponent], imports: [CommonModule], exports: [ToggleButtonComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToggleButtonModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToggleButtonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToggleButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...DECLARATIONS],

package/fesm2022/kirbydesign-designsystem-toggle.mjs CHANGED Viewed

@@ -71,8 +71,8 @@ class ToggleComponent {
         this.disabled = isDisabled;
         this.cdr.detectChanges();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToggleComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: ToggleComponent, isStandalone: true, selector: "kirby-toggle", inputs: { checked: "checked", disabled: "disabled" }, outputs: { checkedChange: "checkedChange" }, host: { properties: { "attr.disabled": "this._isDisabled" } }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToggleComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.9", type: ToggleComponent, isStandalone: true, selector: "kirby-toggle", inputs: { checked: "checked", disabled: "disabled" }, outputs: { checkedChange: "checkedChange" }, host: { properties: { "attr.disabled": "this._isDisabled" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef((() => ToggleComponent)),
@@ -80,7 +80,7 @@ class ToggleComponent {
             },
         ], ngImport: i0, template: "<ion-toggle\n  [checked]=\"checked\"\n  [disabled]=\"disabled\"\n  [class.interaction-state-active]=\"_pressed\"\n  (keydown.space)=\"_onActive()\"\n  (keyup.space)=\"_onInactive()\"\n  (blur)=\"_onInactive()\"\n  (ionChange)=\"onCheckedChange($event.detail.checked)\"\n></ion-toggle>\n", styles: [":host{display:inline-flex}ion-toggle{--track-background: var(--kirby-semi-dark);--handle-background: var(--kirby-white);--track-background-checked: var(--kirby-success);--handle-background-checked: var(--kirby-white);--handle-transition: .2s;--handle-box-shadow: 0 1px 24px 0 rgba(28, 28, 28, .04)}@media (hover: hover) and (pointer: fine){ion-toggle{overflow:visible;contain:none}ion-toggle:focus-within::part(track){transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}@media (hover: hover){ion-toggle:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;--track-background: #777777;--handle-background: whitesmoke;--track-background-checked: #2dc172;--handle-background-checked: whitesmoke}}ion-toggle:active,ion-toggle.interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);--track-background: #6c6c6c;--handle-background: #ebebeb;--track-background-checked: #29ae67;--handle-background-checked: #ebebeb}ion-toggle.in-item.legacy-toggle{padding:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IonToggle, selector: "ion-toggle", inputs: ["checked", "color", "disabled", "enableOnOffLabels", "justify", "labelPlacement", "legacy", "mode", "name", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ToggleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ToggleComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [CommonModule, IonToggle], selector: 'kirby-toggle', providers: [
                         {

package/fesm2022/kirbydesign-designsystem-types.mjs CHANGED Viewed

@@ -5,10 +5,10 @@ class WindowRef {
     get nativeWindow() {
         return window;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: WindowRef, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: WindowRef, providedIn: 'root' }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: WindowRef, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: WindowRef, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: WindowRef, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: WindowRef, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',

package/fesm2022/kirbydesign-designsystem.mjs CHANGED Viewed

@@ -1,12 +1,12 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, Input, HostBinding, Output, ChangeDetectionStrategy, ViewChild, Directive, HostListener, InjectionToken, NgModule, Optional, Inject } from '@angular/core';
-import * as i3 from '@angular/common';
-import { CommonModule } from '@angular/common';
+import { EventEmitter, ElementRef, Component, ViewChild, Input, HostBinding, Output, ChangeDetectionStrategy, Directive, HostListener, InjectionToken, NgModule, Optional, Inject } from '@angular/core';
 import * as i1 from '@kirbydesign/designsystem/icon';
 import { IconModule } from '@kirbydesign/designsystem/icon';
 export * from '@kirbydesign/designsystem/icon';
 import { BadgeComponent } from '@kirbydesign/designsystem/badge';
 import { IonSegment, IonSegmentButton } from '@ionic/angular/standalone';
+import * as i3 from '@angular/common';
+import { CommonModule } from '@angular/common';
 import * as i1$2 from '@kirbydesign/designsystem/types';
 export * from '@kirbydesign/designsystem/types';
 import * as i1$1 from '@kirbydesign/designsystem/modal';
@@ -106,8 +106,7 @@ var SegmentedControlMode;
     SegmentedControlMode["default"] = "default";
 })(SegmentedControlMode || (SegmentedControlMode = {}));
 class SegmentedControlComponent {
-    constructor(iconRegistryService) {
-        this.iconRegistryService = iconRegistryService;
+    constructor() {
         this.mode = SegmentedControlMode.default;
         this._items = [];
         this._selectedIndex = -1;
@@ -139,15 +138,30 @@ class SegmentedControlComponent {
     }
     set items(value) {
         this._items = value || [];
-        this._items.forEach((item) => {
-            if (!item.badge)
-                return;
-            // We need to verify whether badges icon is custom or default, so we can check for it in the template
-            item.badge.isCustomIcon =
-                item.badge.icon !== undefined &&
-                    this.iconRegistryService.getIcon(item.badge.icon) !== undefined;
-        });
         this._value = this.items[this.selectedIndex];
+        this.ensureIonSegmentSelected();
+    }
+    /**
+     * After upgrading to Ionic standalone components (Ionic v.7.6.6)
+     * there is a lifecycle bug between Angular/Ionic/Stencil that prevents
+     * the value of the segment component to be reflected in the checked state
+     * of it's slotted segment buttons.
+     * This has been patched here: https://github.com/ionic-team/ionic-framework/pull/28837
+     * However the patch doesn't fix the problem if `items` are updated after first initialization
+     * and the ion-segment-button(s) are re-rerendered.
+     */
+    ensureIonSegmentSelected() {
+        const ionSegment = this.ionSegmentElement.nativeElement;
+        const ionSelectEvent = ionSegment['ionSelect'];
+        if (this._value && typeof ionSelectEvent?.emit === 'function') {
+            // Ensure changes has been reflected to the DOM:
+            setTimeout(() => {
+                const selectedSegmentButton = ionSegment.querySelector('ion-segment-button.segment-button-checked');
+                if (selectedSegmentButton)
+                    return; // Nothing to patch
+                ionSelectEvent.emit({ value: this._value.id });
+            });
+        }
     }
     get selectedIndex() {
         return this._selectedIndex;
@@ -183,13 +197,16 @@ class SegmentedControlComponent {
             });
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: SegmentedControlComponent, deps: [{ token: i1.IconRegistryService }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: SegmentedControlComponent, 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: { "role": "group" }, properties: { "class": "this._modeCssClass", "class.sm": "this.isSmallSize" } }, ngImport: i0, template: "<ion-segment\n  [value]=\"value?.id\"\n  [scrollable]=\"disableChangeOnSwipe || mode !== 'default'\"\n  (ionChange)=\"onSegmentSelect($event.detail.value)\"\n  (click)=\"preventOutsideClick($event)\"\n>\n  <ng-container *ngFor=\"let item of items\">\n    <ion-segment-button [value]=\"item.id\">\n      {{ item.text }}\n      <kirby-badge\n        *ngIf=\"item.badge\"\n        role=\"text\"\n        [attr.aria-label]=\"item.badge.description\"\n        [themeColor]=\"item.badge.themeColor\"\n      >\n        <ng-container *ngIf=\"item.badge.icon; else badgeContent\">\n          <kirby-icon [name]=\"item.badge.icon\"></kirby-icon>\n        </ng-container>\n        <ng-template #badgeContent>\n          {{ item.badge.content }}\n        </ng-template>\n      </kirby-badge>\n    </ion-segment-button>\n  </ng-container>\n</ion-segment>\n", styles: [":host{display:block;-webkit-user-select:none;user-select:none;--kirby-badge-position: absolute;--kirby-badge-top: -8px;--kirby-badge-right: -16px;--kirby-badge-z-index: 2}:host.sm ion-segment-button{min-height:32px;font-size:12px;--padding-start: 16px;--padding-end: 16px;--kirby-badge-right: -8px}@media (hover: hover) and (pointer: fine){:host.sm ion-segment-button{outline:none;border-radius:999px}:host.sm ion-segment-button:focus{transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}:host.sm ion-segment-button:focus:not(:focus-visible){box-shadow:0 0 0 0 transparent}:host.sm ion-segment-button:focus-visible{transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}:host.default-mode ion-segment{--background: var(--kirby-inputs-background-color);box-shadow:var(--kirby-inputs-elevation);overflow:visible;contain:none;width:-moz-fit-content;width:fit-content}:host.chip-mode ion-segment{--background: none;border-radius:0;padding:4px;gap:8px}@media (pointer: coarse){:host.chip-mode ion-segment{scrollbar-width:none}:host.chip-mode ion-segment::-webkit-scrollbar{display:none}}:host.chip-mode ion-segment-button{--background: var(--kirby-inputs-background-color);--indicator-transition: none}:host.chip-mode ion-segment-button::part(indicator){padding-inline:0}:host.compact ion-segment{--background: transparent}:host.compact ion-segment-button{--background: transparent;--padding-start: 12px;--padding-end: 12px}ion-segment{border-radius:999px;grid-auto-columns:max-content;box-sizing:border-box}ion-segment-button{position:relative;--border-radius: 999px;--border-style: none;--background: none;--color: var(--kirby-inputs-color);--indicator-color: var(--kirby-inputs-indicator-background-color);--color-checked: var(--kirby-inputs-indicator-color);--indicator-box-shadow: none;--indicator-transform: none;--padding-start: 24px;--padding-end: 24px;--margin-bottom: 0;--margin-end: 0;--margin-start: 0;--margin-top: 0;min-height:40px;min-width:-moz-fit-content;min-width:fit-content;font-weight:400;font-size:14px;text-transform:none;margin:0}@media (hover: hover) and (pointer: fine){ion-segment-button:focus-within::part(native){transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}ion-segment-button:after{content:\"\";position:absolute;min-height:44px;min-width:44px;width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%}ion-segment-button::part(native){border-radius:999px;contain:none;overflow:visible}ion-segment-button::part(native):after{transition:all 80ms linear 0ms}ion-segment-button::part(indicator){padding-inline:0}\n"], dependencies: [{ kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "kirby-icon", inputs: ["size", "name", "customName"] }, { kind: "component", type: BadgeComponent, selector: "kirby-badge", inputs: ["text", "size"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IonSegment, selector: "ion-segment", inputs: ["color", "disabled", "mode", "scrollable", "selectOnFocus", "swipeGesture", "value"] }, { kind: "component", type: IonSegmentButton, selector: "ion-segment-button", inputs: ["disabled", "layout", "mode", "type", "value"] }] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: SegmentedControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.9", type: SegmentedControlComponent, 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: { "role": "group" }, properties: { "class": "this._modeCssClass", "class.sm": "this.isSmallSize" } }, viewQueries: [{ propertyName: "ionSegmentElement", first: true, predicate: IonSegment, descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<ion-segment\n  [value]=\"value?.id\"\n  [scrollable]=\"disableChangeOnSwipe || mode !== 'default'\"\n  (ionChange)=\"onSegmentSelect($event.detail.value)\"\n  (click)=\"preventOutsideClick($event)\"\n>\n  <ng-container *ngFor=\"let item of items\">\n    <ion-segment-button [value]=\"item.id\">\n      {{ item.text }}\n      <kirby-badge\n        *ngIf=\"item.badge\"\n        role=\"text\"\n        [attr.aria-label]=\"item.badge.description\"\n        [themeColor]=\"item.badge.themeColor\"\n      >\n        <ng-container *ngIf=\"item.badge.icon; else badgeContent\">\n          <kirby-icon [name]=\"item.badge.icon\"></kirby-icon>\n        </ng-container>\n        <ng-template #badgeContent>\n          {{ item.badge.content }}\n        </ng-template>\n      </kirby-badge>\n    </ion-segment-button>\n  </ng-container>\n</ion-segment>\n", styles: [":host{display:block;-webkit-user-select:none;user-select:none;--kirby-badge-position: absolute;--kirby-badge-top: -8px;--kirby-badge-right: -16px;--kirby-badge-z-index: 2}:host.sm ion-segment-button{min-height:32px;font-size:12px;--padding-start: 16px;--padding-end: 16px;--kirby-badge-right: -8px}@media (hover: hover) and (pointer: fine){:host.sm ion-segment-button{outline:none;border-radius:999px}:host.sm ion-segment-button:focus{transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}:host.sm ion-segment-button:focus:not(:focus-visible){box-shadow:0 0 0 0 transparent}:host.sm ion-segment-button:focus-visible{transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}:host.default-mode ion-segment{--background: var(--kirby-inputs-background-color);box-shadow:var(--kirby-inputs-elevation);overflow:visible;contain:none;width:-moz-fit-content;width:fit-content}:host.default-mode ion-segment-button{--color-hover: rgba(var(--kirby-black-rgb), .4)}:host.chip-mode ion-segment{--background: none;border-radius:0;padding:4px;gap:8px}@media (pointer: coarse){:host.chip-mode ion-segment{scrollbar-width:none}:host.chip-mode ion-segment::-webkit-scrollbar{display:none}}:host.chip-mode ion-segment-button{--background: var(--kirby-inputs-background-color);--indicator-transition: none}:host.chip-mode ion-segment-button::part(indicator){padding-inline:0}:host.compact ion-segment{--background: transparent}:host.compact ion-segment-button{--background: transparent;--padding-start: 12px;--padding-end: 12px}@media (hover: hover){:host.chip-mode ion-segment-button:hover,:host.compact ion-segment-button:hover{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);--background-hover: var(--state-layer-background-color);--background-hover-opacity: var(--state-layer-opacity)}}@media (hover: hover){:host.chip-mode ion-segment-button.segment-button-checked:hover,:host.compact ion-segment-button.segment-button-checked:hover{--state-layer-opacity: .16;--state-layer-background-color: var(--kirby-black-contrast);--background-hover: var(--state-layer-background-color);--background-hover-opacity: var(--state-layer-opacity)}}ion-segment{border-radius:999px;grid-auto-columns:max-content;box-sizing:border-box}ion-segment-button{position:relative;--border-radius: 999px;--border-style: none;--background: none;--color: var(--kirby-inputs-color);--indicator-color: var(--kirby-inputs-indicator-background-color);--color-checked: var(--kirby-inputs-indicator-color);--indicator-box-shadow: none;--indicator-transform: none;--padding-start: 24px;--padding-end: 24px;--margin-bottom: 0;--margin-end: 0;--margin-start: 0;--margin-top: 0;min-height:40px;min-width:-moz-fit-content;min-width:fit-content;font-weight:400;font-size:14px;text-transform:none;margin:0}@media (hover: hover) and (pointer: fine){ion-segment-button:focus-within::part(native){transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}ion-segment-button:after{content:\"\";position:absolute;min-height:44px;min-width:44px;width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%}ion-segment-button::part(native){border-radius:var(--border-radius);contain:none;overflow:visible;opacity:1}ion-segment-button::part(native):after{transition:all 80ms linear 0ms;border-radius:var(--border-radius)}ion-segment-button::part(indicator){padding-inline:0}\n"], dependencies: [{ kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "kirby-icon", inputs: ["size", "name", "customName"] }, { kind: "component", type: BadgeComponent, selector: "kirby-badge", inputs: ["text", "size"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IonSegment, selector: "ion-segment", inputs: ["color", "disabled", "mode", "scrollable", "selectOnFocus", "swipeGesture", "value"] }, { kind: "component", type: IonSegmentButton, selector: "ion-segment-button", inputs: ["disabled", "layout", "mode", "type", "value"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: SegmentedControlComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: SegmentedControlComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, imports: [IconModule, BadgeComponent, CommonModule, IonSegment, IonSegmentButton], selector: 'kirby-segmented-control', host: { role: 'group' }, template: "<ion-segment\n  [value]=\"value?.id\"\n  [scrollable]=\"disableChangeOnSwipe || mode !== 'default'\"\n  (ionChange)=\"onSegmentSelect($event.detail.value)\"\n  (click)=\"preventOutsideClick($event)\"\n>\n  <ng-container *ngFor=\"let item of items\">\n    <ion-segment-button [value]=\"item.id\">\n      {{ item.text }}\n      <kirby-badge\n        *ngIf=\"item.badge\"\n        role=\"text\"\n        [attr.aria-label]=\"item.badge.description\"\n        [themeColor]=\"item.badge.themeColor\"\n      >\n        <ng-container *ngIf=\"item.badge.icon; else badgeContent\">\n          <kirby-icon [name]=\"item.badge.icon\"></kirby-icon>\n        </ng-container>\n        <ng-template #badgeContent>\n          {{ item.badge.content }}\n        </ng-template>\n      </kirby-badge>\n    </ion-segment-button>\n  </ng-container>\n</ion-segment>\n", styles: [":host{display:block;-webkit-user-select:none;user-select:none;--kirby-badge-position: absolute;--kirby-badge-top: -8px;--kirby-badge-right: -16px;--kirby-badge-z-index: 2}:host.sm ion-segment-button{min-height:32px;font-size:12px;--padding-start: 16px;--padding-end: 16px;--kirby-badge-right: -8px}@media (hover: hover) and (pointer: fine){:host.sm ion-segment-button{outline:none;border-radius:999px}:host.sm ion-segment-button:focus{transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}:host.sm ion-segment-button:focus:not(:focus-visible){box-shadow:0 0 0 0 transparent}:host.sm ion-segment-button:focus-visible{transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}:host.default-mode ion-segment{--background: var(--kirby-inputs-background-color);box-shadow:var(--kirby-inputs-elevation);overflow:visible;contain:none;width:-moz-fit-content;width:fit-content}:host.chip-mode ion-segment{--background: none;border-radius:0;padding:4px;gap:8px}@media (pointer: coarse){:host.chip-mode ion-segment{scrollbar-width:none}:host.chip-mode ion-segment::-webkit-scrollbar{display:none}}:host.chip-mode ion-segment-button{--background: var(--kirby-inputs-background-color);--indicator-transition: none}:host.chip-mode ion-segment-button::part(indicator){padding-inline:0}:host.compact ion-segment{--background: transparent}:host.compact ion-segment-button{--background: transparent;--padding-start: 12px;--padding-end: 12px}ion-segment{border-radius:999px;grid-auto-columns:max-content;box-sizing:border-box}ion-segment-button{position:relative;--border-radius: 999px;--border-style: none;--background: none;--color: var(--kirby-inputs-color);--indicator-color: var(--kirby-inputs-indicator-background-color);--color-checked: var(--kirby-inputs-indicator-color);--indicator-box-shadow: none;--indicator-transform: none;--padding-start: 24px;--padding-end: 24px;--margin-bottom: 0;--margin-end: 0;--margin-start: 0;--margin-top: 0;min-height:40px;min-width:-moz-fit-content;min-width:fit-content;font-weight:400;font-size:14px;text-transform:none;margin:0}@media (hover: hover) and (pointer: fine){ion-segment-button:focus-within::part(native){transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}ion-segment-button:after{content:\"\";position:absolute;min-height:44px;min-width:44px;width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%}ion-segment-button::part(native){border-radius:999px;contain:none;overflow:visible}ion-segment-button::part(native):after{transition:all 80ms linear 0ms}ion-segment-button::part(indicator){padding-inline:0}\n"] }]
-        }], ctorParameters: () => [{ type: i1.IconRegistryService }], propDecorators: { mode: [{
+            args: [{ standalone: true, imports: [IconModule, BadgeComponent, CommonModule, IonSegment, IonSegmentButton], selector: 'kirby-segmented-control', host: { role: 'group' }, template: "<ion-segment\n  [value]=\"value?.id\"\n  [scrollable]=\"disableChangeOnSwipe || mode !== 'default'\"\n  (ionChange)=\"onSegmentSelect($event.detail.value)\"\n  (click)=\"preventOutsideClick($event)\"\n>\n  <ng-container *ngFor=\"let item of items\">\n    <ion-segment-button [value]=\"item.id\">\n      {{ item.text }}\n      <kirby-badge\n        *ngIf=\"item.badge\"\n        role=\"text\"\n        [attr.aria-label]=\"item.badge.description\"\n        [themeColor]=\"item.badge.themeColor\"\n      >\n        <ng-container *ngIf=\"item.badge.icon; else badgeContent\">\n          <kirby-icon [name]=\"item.badge.icon\"></kirby-icon>\n        </ng-container>\n        <ng-template #badgeContent>\n          {{ item.badge.content }}\n        </ng-template>\n      </kirby-badge>\n    </ion-segment-button>\n  </ng-container>\n</ion-segment>\n", styles: [":host{display:block;-webkit-user-select:none;user-select:none;--kirby-badge-position: absolute;--kirby-badge-top: -8px;--kirby-badge-right: -16px;--kirby-badge-z-index: 2}:host.sm ion-segment-button{min-height:32px;font-size:12px;--padding-start: 16px;--padding-end: 16px;--kirby-badge-right: -8px}@media (hover: hover) and (pointer: fine){:host.sm ion-segment-button{outline:none;border-radius:999px}:host.sm ion-segment-button:focus{transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}:host.sm ion-segment-button:focus:not(:focus-visible){box-shadow:0 0 0 0 transparent}:host.sm ion-segment-button:focus-visible{transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}:host.default-mode ion-segment{--background: var(--kirby-inputs-background-color);box-shadow:var(--kirby-inputs-elevation);overflow:visible;contain:none;width:-moz-fit-content;width:fit-content}:host.default-mode ion-segment-button{--color-hover: rgba(var(--kirby-black-rgb), .4)}:host.chip-mode ion-segment{--background: none;border-radius:0;padding:4px;gap:8px}@media (pointer: coarse){:host.chip-mode ion-segment{scrollbar-width:none}:host.chip-mode ion-segment::-webkit-scrollbar{display:none}}:host.chip-mode ion-segment-button{--background: var(--kirby-inputs-background-color);--indicator-transition: none}:host.chip-mode ion-segment-button::part(indicator){padding-inline:0}:host.compact ion-segment{--background: transparent}:host.compact ion-segment-button{--background: transparent;--padding-start: 12px;--padding-end: 12px}@media (hover: hover){:host.chip-mode ion-segment-button:hover,:host.compact ion-segment-button:hover{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);--background-hover: var(--state-layer-background-color);--background-hover-opacity: var(--state-layer-opacity)}}@media (hover: hover){:host.chip-mode ion-segment-button.segment-button-checked:hover,:host.compact ion-segment-button.segment-button-checked:hover{--state-layer-opacity: .16;--state-layer-background-color: var(--kirby-black-contrast);--background-hover: var(--state-layer-background-color);--background-hover-opacity: var(--state-layer-opacity)}}ion-segment{border-radius:999px;grid-auto-columns:max-content;box-sizing:border-box}ion-segment-button{position:relative;--border-radius: 999px;--border-style: none;--background: none;--color: var(--kirby-inputs-color);--indicator-color: var(--kirby-inputs-indicator-background-color);--color-checked: var(--kirby-inputs-indicator-color);--indicator-box-shadow: none;--indicator-transform: none;--padding-start: 24px;--padding-end: 24px;--margin-bottom: 0;--margin-end: 0;--margin-start: 0;--margin-top: 0;min-height:40px;min-width:-moz-fit-content;min-width:fit-content;font-weight:400;font-size:14px;text-transform:none;margin:0}@media (hover: hover) and (pointer: fine){ion-segment-button:focus-within::part(native){transition:all 80ms linear 0ms;box-shadow:0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}ion-segment-button:after{content:\"\";position:absolute;min-height:44px;min-width:44px;width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%}ion-segment-button::part(native){border-radius:var(--border-radius);contain:none;overflow:visible;opacity:1}ion-segment-button::part(native):after{transition:all 80ms linear 0ms;border-radius:var(--border-radius)}ion-segment-button::part(indicator){padding-inline:0}\n"] }]
+        }], propDecorators: { ionSegmentElement: [{
+                type: ViewChild,
+                args: [IonSegment, { static: true, read: ElementRef }]
+            }], mode: [{
                 type: Input
             }], _modeCssClass: [{
                 type: HostBinding,
@@ -265,12 +282,12 @@ class PageLocalNavigationComponent {
             });
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: PageLocalNavigationComponent, deps: [{ token: i1$2.WindowRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: PageLocalNavigationComponent, isStandalone: true, selector: "kirby-page-local-navigation", inputs: { items: "items", selectedIndex: "selectedIndex" }, outputs: { selectedIndexChange: "selectedIndexChange" }, viewQueries: [{ propertyName: "tabBarElementRef", first: true, predicate: ["tabBar"], descendants: true }], ngImport: i0, template: "<div class=\"container\">\n  <div class=\"tab-bar\" #tabBar>\n    <div\n      class=\"tab-item\"\n      *ngFor=\"let item of items; let i = index\"\n      (click)=\"onTabChange(i)\"\n      [ngClass]=\"i === selectedIndex ? 'selected' : ''\"\n      [tabIndex]=\"0\"\n      (keydown.enter)=\"onTabChange(i)\"\n      (keydown.arrowLeft)=\"focusNext(i - 1)\"\n      (keydown.arrowRight)=\"focusNext(i + 1)\"\n    >\n      <div class=\"tab-item-inner\" [class.extended]=\"!!item.badge\">\n        <span [attr.text]=\"item.text\">{{ item.text }}</span>\n        <ng-container *ngIf=\"item.badge; let badge\">\n          <kirby-badge\n            role=\"text\"\n            [attr.aria-label]=\"badge.description\"\n            [themeColor]=\"badge.themeColor\"\n          >\n            <ng-container *ngIf=\"badge.content.name; else badgeTextContent\">\n              <kirby-icon\n                *ngIf=\"badge.content.isCustom; else defaultIconName\"\n                [customName]=\"badge.content.name\"\n              ></kirby-icon>\n              <ng-template #defaultIconName>\n                <kirby-icon [name]=\"badge.content.name\"></kirby-icon>\n              </ng-template>\n            </ng-container>\n            <ng-template #badgeTextContent>\n              {{ badge.content.text }}\n            </ng-template>\n          </kirby-badge>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".tab-bar{position:relative;margin:0 auto;display:flex;gap:12px;align-items:center;justify-content:left;flex-wrap:nowrap;overflow-y:hidden;overflow-x:scroll;-webkit-overflow-scrolling:auto;scrollbar-width:none}.tab-bar::-webkit-scrollbar{display:none}.container{position:relative;background-color:var(--kirby-background-color);max-width:var(--page-content-max-width, 792px)}.container:before{content:\"\";background-color:var(--kirby-medium);position:absolute;height:1px;bottom:0;z-index:1;left:0;width:100%}@media (max-width: 824px){.container:before{left:calc(-1 * var(--padding-start, 16px));width:calc(100% + var(--padding-start, 16px) * 2)}}.tab-item{position:relative;cursor:pointer;box-sizing:border-box;outline:none;padding-bottom:2px}.tab-item.selected:before{content:\"\";width:100%;background-color:var(--kirby-dark);position:absolute;border-radius:1px;height:2px;bottom:0;z-index:2}.tab-item.selected,.tab-item:focus,.tab-item:hover{font-weight:700}.tab-item-inner{display:flex;align-items:center;justify-content:center;white-space:nowrap;margin:16px;-webkit-user-select:none;user-select:none}.tab-item-inner kirby-badge{margin-left:4px}.tab-item-inner>span{max-width:100px;overflow:hidden;text-overflow:ellipsis;line-height:24px}.tab-item-inner>span:before{display:block;content:attr(text);font-weight:700;height:0;overflow:hidden;visibility:hidden}\n"], dependencies: [{ kind: "component", type: BadgeComponent, selector: "kirby-badge", inputs: ["text", "size"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "kirby-icon", inputs: ["size", "name", "customName"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: PageLocalNavigationComponent, deps: [{ token: i1$2.WindowRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.9", type: PageLocalNavigationComponent, isStandalone: true, selector: "kirby-page-local-navigation", inputs: { items: "items", selectedIndex: "selectedIndex" }, outputs: { selectedIndexChange: "selectedIndexChange" }, viewQueries: [{ propertyName: "tabBarElementRef", first: true, predicate: ["tabBar"], descendants: true }], ngImport: i0, template: "<div class=\"container\">\n  <div class=\"tab-bar\" #tabBar>\n    <div\n      class=\"tab-item\"\n      *ngFor=\"let item of items; let i = index\"\n      (click)=\"onTabChange(i)\"\n      [ngClass]=\"i === selectedIndex ? 'selected' : ''\"\n      [tabIndex]=\"0\"\n      (keydown.enter)=\"onTabChange(i)\"\n      (keydown.arrowLeft)=\"focusNext(i - 1)\"\n      (keydown.arrowRight)=\"focusNext(i + 1)\"\n    >\n      <div class=\"tab-item-inner\" [class.extended]=\"!!item.badge\">\n        <span [attr.text]=\"item.text\">{{ item.text }}</span>\n        <ng-container *ngIf=\"item.badge; let badge\">\n          <kirby-badge\n            role=\"text\"\n            [attr.aria-label]=\"badge.description\"\n            [themeColor]=\"badge.themeColor\"\n          >\n            <ng-container *ngIf=\"badge.content.name; else badgeTextContent\">\n              <kirby-icon\n                *ngIf=\"badge.content.isCustom; else defaultIconName\"\n                [customName]=\"badge.content.name\"\n              ></kirby-icon>\n              <ng-template #defaultIconName>\n                <kirby-icon [name]=\"badge.content.name\"></kirby-icon>\n              </ng-template>\n            </ng-container>\n            <ng-template #badgeTextContent>\n              {{ badge.content.text }}\n            </ng-template>\n          </kirby-badge>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".tab-bar{position:relative;margin:0 auto;display:flex;gap:12px;align-items:center;justify-content:left;flex-wrap:nowrap;overflow:scroll hidden;-webkit-overflow-scrolling:auto;scrollbar-width:none}.tab-bar::-webkit-scrollbar{display:none}.container{position:relative;background-color:var(--kirby-background-color);max-width:var(--page-content-max-width, 792px)}.container:before{content:\"\";background-color:var(--kirby-medium);position:absolute;height:1px;bottom:0;z-index:1;left:0;width:100%}@media (max-width: 824px){.container:before{left:calc(-1 * var(--padding-start, 16px));width:calc(100% + var(--padding-start, 16px) * 2)}}.tab-item{position:relative;cursor:pointer;box-sizing:border-box;outline:none;padding-bottom:2px}.tab-item.selected:before{content:\"\";width:100%;background-color:var(--kirby-dark);position:absolute;border-radius:1px;height:2px;bottom:0;z-index:2}.tab-item.selected,.tab-item:focus,.tab-item:hover{font-weight:700}.tab-item-inner{display:flex;align-items:center;justify-content:center;white-space:nowrap;margin:16px;-webkit-user-select:none;user-select:none}.tab-item-inner kirby-badge{margin-left:4px}.tab-item-inner>span{max-width:100px;overflow:hidden;text-overflow:ellipsis;line-height:24px}.tab-item-inner>span:before{display:block;content:attr(text);font-weight:700;height:0;overflow:hidden;visibility:hidden}\n"], dependencies: [{ kind: "component", type: BadgeComponent, selector: "kirby-badge", inputs: ["text", "size"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "kirby-icon", inputs: ["size", "name", "customName"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: PageLocalNavigationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: PageLocalNavigationComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, imports: [BadgeComponent, IconModule, CommonModule], selector: 'kirby-page-local-navigation', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\">\n  <div class=\"tab-bar\" #tabBar>\n    <div\n      class=\"tab-item\"\n      *ngFor=\"let item of items; let i = index\"\n      (click)=\"onTabChange(i)\"\n      [ngClass]=\"i === selectedIndex ? 'selected' : ''\"\n      [tabIndex]=\"0\"\n      (keydown.enter)=\"onTabChange(i)\"\n      (keydown.arrowLeft)=\"focusNext(i - 1)\"\n      (keydown.arrowRight)=\"focusNext(i + 1)\"\n    >\n      <div class=\"tab-item-inner\" [class.extended]=\"!!item.badge\">\n        <span [attr.text]=\"item.text\">{{ item.text }}</span>\n        <ng-container *ngIf=\"item.badge; let badge\">\n          <kirby-badge\n            role=\"text\"\n            [attr.aria-label]=\"badge.description\"\n            [themeColor]=\"badge.themeColor\"\n          >\n            <ng-container *ngIf=\"badge.content.name; else badgeTextContent\">\n              <kirby-icon\n                *ngIf=\"badge.content.isCustom; else defaultIconName\"\n                [customName]=\"badge.content.name\"\n              ></kirby-icon>\n              <ng-template #defaultIconName>\n                <kirby-icon [name]=\"badge.content.name\"></kirby-icon>\n              </ng-template>\n            </ng-container>\n            <ng-template #badgeTextContent>\n              {{ badge.content.text }}\n            </ng-template>\n          </kirby-badge>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".tab-bar{position:relative;margin:0 auto;display:flex;gap:12px;align-items:center;justify-content:left;flex-wrap:nowrap;overflow-y:hidden;overflow-x:scroll;-webkit-overflow-scrolling:auto;scrollbar-width:none}.tab-bar::-webkit-scrollbar{display:none}.container{position:relative;background-color:var(--kirby-background-color);max-width:var(--page-content-max-width, 792px)}.container:before{content:\"\";background-color:var(--kirby-medium);position:absolute;height:1px;bottom:0;z-index:1;left:0;width:100%}@media (max-width: 824px){.container:before{left:calc(-1 * var(--padding-start, 16px));width:calc(100% + var(--padding-start, 16px) * 2)}}.tab-item{position:relative;cursor:pointer;box-sizing:border-box;outline:none;padding-bottom:2px}.tab-item.selected:before{content:\"\";width:100%;background-color:var(--kirby-dark);position:absolute;border-radius:1px;height:2px;bottom:0;z-index:2}.tab-item.selected,.tab-item:focus,.tab-item:hover{font-weight:700}.tab-item-inner{display:flex;align-items:center;justify-content:center;white-space:nowrap;margin:16px;-webkit-user-select:none;user-select:none}.tab-item-inner kirby-badge{margin-left:4px}.tab-item-inner>span{max-width:100px;overflow:hidden;text-overflow:ellipsis;line-height:24px}.tab-item-inner>span:before{display:block;content:attr(text);font-weight:700;height:0;overflow:hidden;visibility:hidden}\n"] }]
+            args: [{ standalone: true, imports: [BadgeComponent, IconModule, CommonModule], selector: 'kirby-page-local-navigation', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\">\n  <div class=\"tab-bar\" #tabBar>\n    <div\n      class=\"tab-item\"\n      *ngFor=\"let item of items; let i = index\"\n      (click)=\"onTabChange(i)\"\n      [ngClass]=\"i === selectedIndex ? 'selected' : ''\"\n      [tabIndex]=\"0\"\n      (keydown.enter)=\"onTabChange(i)\"\n      (keydown.arrowLeft)=\"focusNext(i - 1)\"\n      (keydown.arrowRight)=\"focusNext(i + 1)\"\n    >\n      <div class=\"tab-item-inner\" [class.extended]=\"!!item.badge\">\n        <span [attr.text]=\"item.text\">{{ item.text }}</span>\n        <ng-container *ngIf=\"item.badge; let badge\">\n          <kirby-badge\n            role=\"text\"\n            [attr.aria-label]=\"badge.description\"\n            [themeColor]=\"badge.themeColor\"\n          >\n            <ng-container *ngIf=\"badge.content.name; else badgeTextContent\">\n              <kirby-icon\n                *ngIf=\"badge.content.isCustom; else defaultIconName\"\n                [customName]=\"badge.content.name\"\n              ></kirby-icon>\n              <ng-template #defaultIconName>\n                <kirby-icon [name]=\"badge.content.name\"></kirby-icon>\n              </ng-template>\n            </ng-container>\n            <ng-template #badgeTextContent>\n              {{ badge.content.text }}\n            </ng-template>\n          </kirby-badge>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".tab-bar{position:relative;margin:0 auto;display:flex;gap:12px;align-items:center;justify-content:left;flex-wrap:nowrap;overflow:scroll hidden;-webkit-overflow-scrolling:auto;scrollbar-width:none}.tab-bar::-webkit-scrollbar{display:none}.container{position:relative;background-color:var(--kirby-background-color);max-width:var(--page-content-max-width, 792px)}.container:before{content:\"\";background-color:var(--kirby-medium);position:absolute;height:1px;bottom:0;z-index:1;left:0;width:100%}@media (max-width: 824px){.container:before{left:calc(-1 * var(--padding-start, 16px));width:calc(100% + var(--padding-start, 16px) * 2)}}.tab-item{position:relative;cursor:pointer;box-sizing:border-box;outline:none;padding-bottom:2px}.tab-item.selected:before{content:\"\";width:100%;background-color:var(--kirby-dark);position:absolute;border-radius:1px;height:2px;bottom:0;z-index:2}.tab-item.selected,.tab-item:focus,.tab-item:hover{font-weight:700}.tab-item-inner{display:flex;align-items:center;justify-content:center;white-space:nowrap;margin:16px;-webkit-user-select:none;user-select:none}.tab-item-inner kirby-badge{margin-left:4px}.tab-item-inner>span{max-width:100px;overflow:hidden;text-overflow:ellipsis;line-height:24px}.tab-item-inner>span:before{display:block;content:attr(text);font-weight:700;height:0;overflow:hidden;visibility:hidden}\n"] }]
         }], ctorParameters: () => [{ type: i1$2.WindowRef }], propDecorators: { items: [{
                 type: Input
             }], selectedIndex: [{
@@ -296,10 +313,10 @@ class KeyHandlerDirective {
             hostElement.click();
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KeyHandlerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.9", type: KeyHandlerDirective, selector: "[keyHandler]", host: { listeners: { "keyup": "keyEvent($event)" } }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KeyHandlerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.9", type: KeyHandlerDirective, selector: "[keyHandler]", host: { listeners: { "keyup": "keyEvent($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KeyHandlerDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KeyHandlerDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -322,10 +339,10 @@ class ModalRouterLinkDirective {
         this.modalNavigationService.navigateToModal(this.path, typeof this.queryParams !== 'string' ? this.queryParams : null, this.alertConfig || null);
         return false;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ModalRouterLinkDirective, deps: [{ token: i1$1.ModalNavigationService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.9", type: ModalRouterLinkDirective, selector: "[kirbyModalRouterLink]", inputs: { path: ["kirbyModalRouterLink", "path"], queryParams: ["kirbyModalQueryParams", "queryParams"], alertConfig: ["kirbyAlertConfig", "alertConfig"] }, host: { listeners: { "click": "onClick()" } }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ModalRouterLinkDirective, deps: [{ token: i1$1.ModalNavigationService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.9", type: ModalRouterLinkDirective, selector: "[kirbyModalRouterLink]", inputs: { path: ["kirbyModalRouterLink", "path"], queryParams: ["kirbyModalQueryParams", "queryParams"], alertConfig: ["kirbyAlertConfig", "alertConfig"] }, host: { listeners: { "click": "onClick()" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: ModalRouterLinkDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: ModalRouterLinkDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: `[kirbyModalRouterLink]`,
@@ -437,8 +454,8 @@ class KirbyModule {
     constructor(modalController, config) {
         modalController.initialize(config && config.moduleRootRoutePath);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KirbyModule, deps: [{ token: i1$1.ModalController }, { token: ConfigToken, optional: true }], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: KirbyModule, declarations: [ModalRouterLinkDirective, KeyHandlerDirective], imports: [CommonModule, RouterModule, KirbyIonicModule, KirbyAppModule,
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KirbyModule, deps: [{ token: i1$1.ModalController }, { token: ConfigToken, optional: true }], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.9", ngImport: i0, type: KirbyModule, declarations: [ModalRouterLinkDirective, KeyHandlerDirective], imports: [CommonModule, RouterModule, KirbyIonicModule, KirbyAppModule,
             RouterOutletModule,
             PageModule,
             HeaderModule,
@@ -547,7 +564,7 @@ class KirbyModule {
             FlagComponent,
             BadgeComponent,
             ModalComponent, ModalRouterLinkDirective] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KirbyModule, providers: providers, imports: [CommonModule, RouterModule, KirbyIonicModule, KirbyAppModule,
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KirbyModule, providers: providers, imports: [CommonModule, RouterModule, KirbyIonicModule, KirbyAppModule,
             RouterOutletModule,
             PageModule,
             HeaderModule,
@@ -621,7 +638,7 @@ class KirbyModule {
             HeaderModule,
             KirbyModalModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KirbyModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KirbyModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, RouterModule, KirbyIonicModule, ...importedModules],
@@ -642,11 +659,11 @@ const COMPONENT_DECLARATIONS = [PageLocalNavigationComponent];
  * @see KirbyModule
  */
 class KirbyExperimentalModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KirbyExperimentalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: KirbyExperimentalModule, imports: [CommonModule, KirbyModule, PageLocalNavigationComponent], exports: [PageLocalNavigationComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KirbyExperimentalModule, imports: [CommonModule, KirbyModule, PageLocalNavigationComponent] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KirbyExperimentalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.9", ngImport: i0, type: KirbyExperimentalModule, imports: [CommonModule, KirbyModule, PageLocalNavigationComponent], exports: [PageLocalNavigationComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KirbyExperimentalModule, imports: [CommonModule, KirbyModule, PageLocalNavigationComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: KirbyExperimentalModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: KirbyExperimentalModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, KirbyModule, PageLocalNavigationComponent],