@kirbydesign/designsystem 11.11.2 → 12.0.0

package/fesm2022/kirbydesign-designsystem-list.mjs

@@ -1,703 +1,1188 @@
-import * as i0 from '@angular/core';
-import { EventEmitter, HostListener, Input, Output, Directive, HostBinding, Injectable, ViewChild, ChangeDetectionStrategy, Component, TemplateRef, ContentChild, NgModule } from '@angular/core';
-import { Subject, fromEvent } from 'rxjs';
-import { takeUntil, debounceTime, filter, map } from 'rxjs/operators';
-import * as i1 from '@kirbydesign/designsystem/types';
-import { IonList, IonItemSliding, IonItemOptions, IonLabel, IonListHeader, IonItemGroup, IonItemDivider } from '@ionic/angular/standalone';
-import * as i1$1 from '@kirbydesign/designsystem/helpers';
-import { elementHasAncestor } from '@kirbydesign/designsystem/helpers';
-import { NgClass, NgTemplateOutlet, CommonModule } from '@angular/common';
-import { IconComponent, IconModule } from '@kirbydesign/designsystem/icon';
-import { forwardAttributes } from '@kirbydesign/designsystem/shared';
-import { SpinnerComponent, SpinnerModule } from '@kirbydesign/designsystem/spinner';
-
-/**
- * Specify debounce duration in ms
- */
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, ContentChild, Directive, EventEmitter, HostBinding, HostListener, Injectable, Input, NgModule, Output, TemplateRef, ViewChild } from "@angular/core";
+import { Subject, fromEvent } from "rxjs";
+import { debounceTime, filter, map, takeUntil } from "rxjs/operators";
+import * as i1$1 from "@kirbydesign/designsystem/types";
+import { IonItemDivider, IonItemGroup, IonItemOptions, IonItemSliding, IonLabel, IonList, IonListHeader } from "@ionic/angular";
+import * as i1 from "@kirbydesign/designsystem/helpers";
+import { elementHasAncestor } from "@kirbydesign/designsystem/helpers";
+import { CommonModule, NgClass, NgTemplateOutlet } from "@angular/common";
+import { IconComponent, IconModule } from "@kirbydesign/designsystem/icon";
+import { forwardAttributes } from "@kirbydesign/designsystem/shared";
+import { SpinnerComponent, SpinnerModule } from "@kirbydesign/designsystem/spinner";
 const INFINITE_SCROLL_DEBOUNCE = 100;
-class InfiniteScrollDirective {
-    constructor(elementRef, windowRef, zone) {
-        this.elementRef = elementRef;
-        this.windowRef = windowRef;
-        this.zone = zone;
-        /**
-         * Event that will be triggered when the user has scrolled to
-         * bottom of the element
-         */
-        this.scrollEnd = new EventEmitter();
-        /**
-         * If true then {@link scrollEnd} event should NOT be emitted
-         */
-        this.disabled = false;
-        /**
-         * Emits a new value on element scroll event
-         */
-        this.scroll$ = new Subject();
-        /**
-         * Completes on component destroy lifecycle event
-         * used to unsubscribe from infinite observables
-         */
-        this.ngUnsubscribe$ = new Subject();
-        /**
-         * An offset from the bottom of the element to trigger {@link scrollEnd} event
-         */
-        this.offset = 0.8;
-    }
-    ngAfterViewInit() {
-        /**
-         * Subscribe to {@link scroll$} observable and emit {@link scrollEnd} event
-         * when element scroll position has surpassed the offset.
-         */
-        this.scroll$
-            .pipe(takeUntil(this.ngUnsubscribe$), debounceTime(INFINITE_SCROLL_DEBOUNCE), filter(() => !this.disabled), filter((scroll) => {
-            return (scroll.elementHeight * (1 - this.offset) >=
-                scroll.distanceToViewBottom - scroll.viewHeight);
-        }))
-            .subscribe(() => {
-            this.scrollEnd.emit();
-        });
-        /**
-         * Subscribe to the ionScroll event on the ion-content around the list (if any)
-         * and emit {@link scrollEnd} event when element scroll position has surpassed the offset.
-         */
-        setTimeout(() => {
-            const ionContent = this.elementRef.nativeElement.closest('ion-content');
-            if (ionContent) {
-                // we run the 'ionScroll' event outside angular, as it would trigger change detection on each scroll
-                this.zone.runOutsideAngular(() => {
-                    fromEvent(ionContent, 'ionScroll')
-                        .pipe(takeUntil(this.ngUnsubscribe$), debounceTime(INFINITE_SCROLL_DEBOUNCE), filter(() => !this.disabled), map(() => this.getScroll()), filter((scroll) => {
-                        return (scroll.elementHeight * (1 - this.offset) >=
-                            scroll.distanceToViewBottom - scroll.viewHeight);
-                    }))
-                        .subscribe(() => {
-                        // we make sure to emit the event inside angular again. As we want to show the spinner and need change detection for that.
-                        this.zone.run(() => this.scrollEnd.emit());
-                    });
-                });
-            }
-        });
-    }
-    /**
-     * On element scroll event emit next {@link scroll$} observable value
-     */
-    onScroll() {
-        if (this.disabled)
-            return;
-        const scroll = this.getScroll();
-        this.scroll$.next(scroll);
-    }
-    /**
-     * trigger {@link ngUnsubscribe} complete on component destroy lifecycle hook
-     */
-    ngOnDestroy() {
-        this.ngUnsubscribe$.next();
-        this.ngUnsubscribe$.complete();
-    }
-    getScroll() {
-        const element = this.elementRef.nativeElement;
-        const boundindClientRect = element.getBoundingClientRect();
-        const distanceToViewBottom = boundindClientRect.bottom;
-        const elementHeight = boundindClientRect.height;
-        const viewHeight = this.windowRef.nativeWindow.innerHeight;
-        return { distanceToViewBottom, elementHeight, viewHeight };
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: InfiniteScrollDirective, deps: [{ token: i0.ElementRef }, { token: i1.WindowRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.18", type: InfiniteScrollDirective, isStandalone: true, selector: "[kirbyInfiniteScroll]", inputs: { disabled: "disabled" }, outputs: { scrollEnd: "scrollEnd" }, host: { listeners: { "window:scroll": "onScroll()" } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: InfiniteScrollDirective, decorators: [{
-            type: Directive,
-            args: [{ selector: '[kirbyInfiniteScroll]' }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.WindowRef }, { type: i0.NgZone }], propDecorators: { scrollEnd: [{
-                type: Output
-            }], disabled: [{
-                type: Input
-            }], onScroll: [{
-                type: HostListener,
-                args: ['window:scroll']
-            }] } });
-
-class ListItemColorDirective {
-    ngOnChanges() {
-        this.color = this.getColor();
-    }
-    getColor() {
-        if (!this.kirbyListItemColor || !this.item) {
-            return;
-        }
-        const themeColor = this.kirbyListItemColor(this.item);
-        return themeColor;
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListItemColorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.18", type: ListItemColorDirective, isStandalone: true, selector: "[kirbyListItemColor]", inputs: { kirbyListItemColor: "kirbyListItemColor", item: "item" }, host: { properties: { "class": "this.color" } }, usesOnChanges: true, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListItemColorDirective, decorators: [{
-            type: Directive,
-            args: [{ selector: '[kirbyListItemColor]' }]
-        }], propDecorators: { kirbyListItemColor: [{
-                type: Input
-            }], item: [{
-                type: Input
-            }], color: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-class ListHelper {
-    onLoadOnDemand(component) {
-        if (component.isLoadOnDemandEnabled && !component._isLoading) {
-            component._isLoading = true;
-            component.loadOnDemand.emit({
-                complete: (disableLoadOnDemand) => {
-                    component.isLoadOnDemandEnabled = !disableLoadOnDemand;
-                    component._isLoading = false;
-                },
-            });
-        }
-    }
-    groupSections(items, getGroupName) {
-        const groupsMap = new Map();
-        items.forEach((item) => {
-            const itemGroup = getGroupName(item);
-            const groupItems = groupsMap.get(itemGroup);
-            if (groupItems) {
-                groupItems.push(item);
-            }
-            else {
-                groupsMap.set(itemGroup, [item]);
-            }
-        });
-        return Array.from(groupsMap)
-            .sort(([name], [otherName]) => name.localeCompare(otherName))
-            .map(([name, items]) => {
-            return { name, items };
-        });
-    }
-    groupStandAloneItems(items, standAloneProperty) {
-        const list = items.reduce((accumulator, item) => {
-            const lastList = accumulator[accumulator.length - 1];
-            const lastItemInList = lastList[lastList.length - 1];
-            if (!lastItemInList) {
-                lastList.push(item);
-            }
-            else if (!item[standAloneProperty] && !lastItemInList[standAloneProperty]) {
-                lastList.push(item);
-            }
-            else {
-                accumulator.push([item]);
-            }
-            return accumulator;
-        }, [[]]);
-        return list.map((items) => {
-            return { items };
-        });
-    }
-    groupSectionsWithStandAloneItems(items, getGroupName, standAloneProperty) {
-        const sectionsMap = new Map();
-        items.forEach((item) => {
-            const sectionName = getGroupName(item);
-            if (sectionsMap.has(sectionName)) {
-                const section = sectionsMap.get(sectionName);
-                const lastListInSection = section[section.length - 1];
-                const lastItemInList = lastListInSection[lastListInSection.length - 1];
-                if (!item[standAloneProperty] && !lastItemInList[standAloneProperty]) {
-                    lastListInSection.push(item);
-                }
-                else {
-                    section.push([item]);
-                }
-            }
-            else {
-                sectionsMap.set(sectionName, [[item]]);
-            }
-        });
-        return Array.from(sectionsMap)
-            .sort(([name], [otherName]) => name.localeCompare(otherName))
-            .map(([name, lists]) => {
-            return { name, lists };
-        });
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListHelper, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListHelper }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListHelper, decorators: [{
-            type: Injectable
-        }] });
-
-class ListExperimentalComponent {
-    closeAllSlidingItems(e) {
-        if (elementHasAncestor(e.target, 'ion-item-option', 'ion-list')) {
-            this.list.closeSlidingItems();
-        }
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListExperimentalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: ListExperimentalComponent, isStandalone: true, selector: "kirby-list-experimental", host: { listeners: { "click": "closeAllSlidingItems($event)" } }, viewQueries: [{ propertyName: "list", first: true, predicate: IonList, descendants: true, static: true }], ngImport: i0, template: "<ng-content select=\"[outside]\"></ng-content>\n<div class=\"rounded shadow first-item-padding last-item-padding\">\n  <ng-content></ng-content>\n</div>\n", styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}.rounded{border-radius:16px;overflow:hidden}.shadow{box-shadow:0 1px 24px #1c1c1c0a}.first-item-padding>::ng-deep :first-child{--item-padding-top: 8px}.last-item-padding>::ng-deep :last-child{--item-padding-bottom: 8px}.first-item{border-top-left-radius:16px;border-top-right-radius:16px;overflow:hidden}.first-item>::ng-deep :first-child{--item-padding-top: 8px}.last-item{border-bottom-left-radius:16px;border-bottom-right-radius:16px;overflow:hidden}.last-item>::ng-deep :last-child{--item-padding-bottom: 8px}:host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListExperimentalComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'kirby-list-experimental', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"[outside]\"></ng-content>\n<div class=\"rounded shadow first-item-padding last-item-padding\">\n  <ng-content></ng-content>\n</div>\n", styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}.rounded{border-radius:16px;overflow:hidden}.shadow{box-shadow:0 1px 24px #1c1c1c0a}.first-item-padding>::ng-deep :first-child{--item-padding-top: 8px}.last-item-padding>::ng-deep :last-child{--item-padding-bottom: 8px}.first-item{border-top-left-radius:16px;border-top-right-radius:16px;overflow:hidden}.first-item>::ng-deep :first-child{--item-padding-top: 8px}.last-item{border-bottom-left-radius:16px;border-bottom-right-radius:16px;overflow:hidden}.last-item>::ng-deep :last-child{--item-padding-bottom: 8px}:host{display:block}\n"] }]
-        }], propDecorators: { list: [{
-                type: ViewChild,
-                args: [IonList, { static: true }]
-            }], closeAllSlidingItems: [{
-                type: HostListener,
-                args: ['click', ['$event']]
-            }] } });
-
-class ListHeaderComponent {
-    constructor() { }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: ListHeaderComponent, isStandalone: true, selector: "kirby-list-header", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{background-color:transparent;display:flex;flex-direction:row;justify-content:space-between;width:100%;padding:24px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListHeaderComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'kirby-list-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n", styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{background-color:transparent;display:flex;flex-direction:row;justify-content:space-between;width:100%;padding:24px}\n"] }]
-        }], ctorParameters: () => [] });
-
-class ListItemComponent {
-    constructor(platform) {
-        this.platform = platform;
-        this._isSwipingEnabled = false;
-        this.swipeActions = [];
-        this.itemSelect = new EventEmitter();
-        this.swipeActionSelect = new EventEmitter();
-        this.initializeSwipeActions();
-    }
-    _onItemSelect(item) {
-        if (!this.isSelectable)
-            return;
-        this.itemSelect.emit(item);
-    }
-    _onSwipeActionSelect(swipeAction, item, event) {
-        this.swipeActionSelect.emit({
-            swipeAction,
-            item,
-            event,
-        });
-    }
-    ngOnInit() {
-        this.initializeSwipeActions();
-    }
-    ngAfterViewInit() {
-        if (!this.itemTemplate) {
-            console.warn('No item template was provided.');
-        }
-    }
-    _hasSwipeActions(item) {
-        if (!Array.isArray(this.swipeActions)) {
-            return false;
-        }
-        return this.swipeActions.some((swipeAction) => {
-            if (swipeAction.isDisabled instanceof Function && swipeAction.isDisabled(item)) {
-                return false;
-            }
-            if (swipeAction.isDisabled === true) {
-                return false;
-            }
-            return swipeAction.position === 'left' || swipeAction.position === 'right';
-        });
-    }
-    _getSwipeActions(item, direction) {
-        if (!Array.isArray(this.swipeActions)) {
-            return [];
-        }
-        return this.swipeActions.filter((swipeAction) => {
-            if (this.isSwipeActionDisabled(swipeAction, item)) {
-                return false;
-            }
-            return direction ? swipeAction.position === direction : true;
-        });
-    }
-    isSwipeActionDisabled(swipeAction, item) {
-        if (swipeAction.isDisabled instanceof Function && swipeAction.isDisabled(item)) {
-            return true;
-        }
-        return swipeAction.isDisabled === true;
-    }
-    _getSwipeActionEnd(item) {
-        if (this._getSwipeActions(item, 'left').length) {
-            return 'start';
-        }
-        return 'end';
-    }
-    _getSwipeActionIcon(swipeAction, item) {
-        if (!swipeAction.icon)
-            return;
-        if (swipeAction.icon instanceof Function) {
-            return swipeAction.icon(item);
-        }
-        return swipeAction.icon;
-    }
-    _getSwipeActionTitle(swipeAction, item) {
-        if (swipeAction.title instanceof Function) {
-            return swipeAction.title(item);
-        }
-        return swipeAction.title;
-    }
-    _getSwipeActionType(swipeAction, item) {
-        if (swipeAction.type instanceof Function) {
-            return swipeAction.type(item);
-        }
-        return swipeAction.type;
-    }
-    initializeSwipeActions() {
-        if (this.swipeActions && this.swipeActions.length) {
-            this._isSwipingEnabled = this.platform.isTouch();
-        }
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListItemComponent, deps: [{ token: i1$1.PlatformService }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: ListItemComponent, 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" }, viewQueries: [{ propertyName: "ionItemSliding", first: true, predicate: IonItemSliding, descendants: true }], ngImport: i0, template: "<ion-item-sliding\n  [class.selected]=\"isSelected\"\n  [kirbyListItemColor]=\"getItemColor\"\n  [item]=\"item\"\n  [disabled]=\"_isSwipingEnabled ? null : true\"\n  keyHandler\n  [ngClass]=\"boundaryClass\"\n  (click)=\"_onItemSelect(item)\"\n>\n  <ng-container\n    *ngTemplateOutlet=\"swipeActionsTemplate; context: { $implicit: item }\"\n  ></ng-container>\n  <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n</ion-item-sliding>\n\n<ng-template #swipeActionsTemplate let-item>\n  @if (_hasSwipeActions(item)) {\n    <ion-item-options [side]=\"_getSwipeActionEnd(item)\">\n      <div class=\"swipe-action\">\n        @for (swipeAction of _getSwipeActions(item); track swipeAction.title) {\n          <ion-item-option\n            [ngClass]=\"_getSwipeActionType(swipeAction, item)\"\n            (click)=\"_onSwipeActionSelect(swipeAction, item, $event)\"\n          >\n            <div class=\"item-content\">\n              @if (_getSwipeActionIcon(swipeAction, item)) {\n                <kirby-icon size=\"sm\" [name]=\"_getSwipeActionIcon(swipeAction, item)\"></kirby-icon>\n              }\n              <ion-label>\n                {{ _getSwipeActionTitle(swipeAction, item) }}\n              </ion-label>\n            </div>\n          </ion-item-option>\n        }\n      </div>\n    </ion-item-options>\n  }\n</ng-template>\n", styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}ion-item-option.primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}ion-item-option.secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}ion-item-option.tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}ion-item-option.success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}ion-item-option.warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}ion-item-option.danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}ion-item-option.white-overlay{background-color:var(--kirby-white-overlay);color:var(--kirby-white-overlay-contrast)}ion-item-option.light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}ion-item-option.medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}ion-item-option.dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}ion-item-option.dark-overlay{background-color:var(--kirby-dark-overlay);color:var(--kirby-dark-overlay-contrast)}:host{display:block}:host(:not(kirby-list-item)){--kirby-list-border-top-radius: var( --kirby-content-border-top-radius, var(--kirby-border-radius-n) );--kirby-list-border-bottom-radius: var( --kirby-content-border-bottom-radius, var(--kirby-border-radius-n) )}.list{box-shadow:0 1px 24px #1c1c1c0a;background:transparent;contain:inherit;padding:0}ion-list-header{background-color:var(--kirby-white);border-bottom:1px solid var(--kirby-background-color);padding:0;text-transform:inherit;letter-spacing:inherit;font-weight:inherit;font-size:inherit;min-height:0;overflow:inherit}ion-item{--background: var(--kirby-white);--background-activated: var(--kirby-white-shade);--background-hover: var(--kirby-background-color);--background-focused: var(--kirby-background-color);--inner-border-width: 0;--ion-safe-area-right: 0;--min-height: 56px;--padding-bottom: 8px;--padding-end: 16px;--padding-start: 16px;--padding-top: 8px;display:flex;font-size:clamp(12px,.875rem,28px);min-height:56px;overflow:visible;width:100%}ion-item-sliding{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color)}ion-item-sliding.item-sliding-active-slide{backface-visibility:hidden;transform:translateZ(0)}ion-item-sliding.light{--kirby-inputs-background-color: var(--kirby-white);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-divider-color: var(--kirby-medium);--kirby-inputs-elevation: var(--kirby-elevation-2);--kirby-item-background: var(--kirby-light);--kirby-item-background-activated: var(--kirby-light-shade);--kirby-item-background-focused: var(--kirby-light-shade);--kirby-item-background-hover: var(--kirby-light-tint)}ion-item-sliding.light ion-item{--background: var(--kirby-light);--color: var(--kirby-light-contrast);--background-activated: var(--kirby-light-shade);--background-focused: var(--kirby-light-shade);--background-hover: var(--kirby-light-tint)}ion-item-group{margin-bottom:24px}ion-item-group:last-of-type{margin-bottom:0}ion-item-divider{--inner-padding-end: 0;--color: unset;background-color:transparent;border-color:transparent;min-height:0;padding:0 16px 8px;font-weight:inherit}.footer{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color);background-color:var(--kirby-white);border-top:1px solid var(--kirby-background-color);display:flex;align-items:center;justify-content:space-between;width:100%}.no-more-items,.loading{width:100%;padding:24px 0;text-align:center}.swipe-action{display:flex;color:var(--kirby-black);background-color:transparent}.swipe-action ion-item-option{height:100%;display:inline-block;text-align:center}.swipe-action .item-content{display:inline-grid;min-width:70px;flex-direction:column}.swipe-action .item-content ion-label{--background: unset;--color: unset}ion-item-options[side=end]{border-bottom-width:0}:host-context(.has-sections) .list,:host-context(.has-stand-alone) .list{box-shadow:none}:host-context(.has-sections) .list-items,:host-context(.has-stand-alone) .list-items{box-shadow:0 1px 24px #1c1c1c0a;border-radius:var(--kirby-border-radius-n)}:host-context(.has-sections) .footer,:host-context(.has-stand-alone) .footer{background-color:transparent;border-top:none}:host-context(.has-sections) ion-list-header,:host-context(.has-stand-alone) ion-list-header{background-color:transparent;border-bottom:none}:host-context(.shape-rounded) .list,:host-context(.shape-rounded) .list-items{border-radius:var(--kirby-list-border-top-radius) var(--kirby-list-border-top-radius) var(--kirby-list-border-bottom-radius) var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item.first,:host-context(.shape-rounded) ion-item-sliding.first,:host-context(.shape-rounded) ion-list-header{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) ion-list-header{border-top-left-radius:var(--kirby-list-border-top-radius);border-top-right-radius:var(--kirby-list-border-top-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item-sliding{border-top-left-radius:0;border-top-right-radius:0}:host-context(.shape-rounded) ion-item.last,:host-context(.shape-rounded) ion-item-sliding.last,:host-context(.shape-rounded) .footer{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) .footer{border-bottom-left-radius:var(--kirby-list-border-bottom-radius);border-bottom-right-radius:var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item-sliding{border-bottom-left-radius:0;border-bottom-right-radius:0}kirby-list-item{--kirby-content-border-top-radius: 0;--kirby-content-border-bottom-radius: 0}kirby-list-item:first-of-type{--kirby-content-border-top-radius: var(--kirby-list-border-top-radius)}kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: var(--kirby-list-border-bottom-radius)}.has-header kirby-list-item:first-of-type{--kirby-content-border-top-radius: 0}.has-footer kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: 0}:host-context(.shape-none) .list,:host-context(.shape-none) .list-items{box-shadow:none;border-radius:unset;--kirby-item-background: transparent;--kirby-list-item-border-color: var(--kirby-medium)}:host-context(kirby-card){--kirby-list-item-border-color: var(--kirby-background-color)}:host-context(kirby-card.outlined){--kirby-list-item-border-color: var(--kirby-medium)}:host-context(.item-spacing) .list kirby-list-item{margin-bottom:16px}:host-context(.item-spacing) .list kirby-list-item>ion-item,:host-context(.item-spacing) .list kirby-list-item:last-child{margin-bottom:0}.stand-alone-bottom-margin-xxxxxl{margin-bottom:72px}.stand-alone-bottom-margin-xxxxl{margin-bottom:64px}.stand-alone-bottom-margin-xxxl{margin-bottom:56px}.stand-alone-bottom-margin-xxl{margin-bottom:48px}.stand-alone-bottom-margin-xl{margin-bottom:40px}.stand-alone-bottom-margin-l{margin-bottom:32px}.stand-alone-bottom-margin-m{margin-bottom:24px}.stand-alone-bottom-margin-s{margin-bottom:16px}.stand-alone-bottom-margin-xs{margin-bottom:12px}.stand-alone-bottom-margin-xxs{margin-bottom:8px}.stand-alone-bottom-margin-xxxs{margin-bottom:4px}.stand-alone-bottom-margin-xxxxs{margin-bottom:2px}\n", ".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{overflow:hidden}:host-context(.has-divider) ion-item-sliding:not(.last){border-bottom:1px solid var(--kirby-list-item-border-color, var(--kirby-background-color))}\n"], dependencies: [{ kind: "component", type: IonItemSliding, selector: "ion-item-sliding", inputs: ["disabled"] }, { kind: "directive", type: ListItemColorDirective, selector: "[kirbyListItemColor]", inputs: ["kirbyListItemColor", "item"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IonItemOptions, selector: "ion-item-options", inputs: ["side"] }, { kind: "component", type: IconComponent, selector: "kirby-icon", inputs: ["size", "name"] }, { kind: "component", type: IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListItemComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'kirby-list-item', imports: [
-                        IonItemSliding,
-                        ListItemColorDirective,
-                        NgClass,
-                        NgTemplateOutlet,
-                        IonItemOptions,
-                        IconComponent,
-                        IonLabel,
-                    ], template: "<ion-item-sliding\n  [class.selected]=\"isSelected\"\n  [kirbyListItemColor]=\"getItemColor\"\n  [item]=\"item\"\n  [disabled]=\"_isSwipingEnabled ? null : true\"\n  keyHandler\n  [ngClass]=\"boundaryClass\"\n  (click)=\"_onItemSelect(item)\"\n>\n  <ng-container\n    *ngTemplateOutlet=\"swipeActionsTemplate; context: { $implicit: item }\"\n  ></ng-container>\n  <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n</ion-item-sliding>\n\n<ng-template #swipeActionsTemplate let-item>\n  @if (_hasSwipeActions(item)) {\n    <ion-item-options [side]=\"_getSwipeActionEnd(item)\">\n      <div class=\"swipe-action\">\n        @for (swipeAction of _getSwipeActions(item); track swipeAction.title) {\n          <ion-item-option\n            [ngClass]=\"_getSwipeActionType(swipeAction, item)\"\n            (click)=\"_onSwipeActionSelect(swipeAction, item, $event)\"\n          >\n            <div class=\"item-content\">\n              @if (_getSwipeActionIcon(swipeAction, item)) {\n                <kirby-icon size=\"sm\" [name]=\"_getSwipeActionIcon(swipeAction, item)\"></kirby-icon>\n              }\n              <ion-label>\n                {{ _getSwipeActionTitle(swipeAction, item) }}\n              </ion-label>\n            </div>\n          </ion-item-option>\n        }\n      </div>\n    </ion-item-options>\n  }\n</ng-template>\n", styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}ion-item-option.primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}ion-item-option.secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}ion-item-option.tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}ion-item-option.success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}ion-item-option.warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}ion-item-option.danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}ion-item-option.white-overlay{background-color:var(--kirby-white-overlay);color:var(--kirby-white-overlay-contrast)}ion-item-option.light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}ion-item-option.medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}ion-item-option.dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}ion-item-option.dark-overlay{background-color:var(--kirby-dark-overlay);color:var(--kirby-dark-overlay-contrast)}:host{display:block}:host(:not(kirby-list-item)){--kirby-list-border-top-radius: var( --kirby-content-border-top-radius, var(--kirby-border-radius-n) );--kirby-list-border-bottom-radius: var( --kirby-content-border-bottom-radius, var(--kirby-border-radius-n) )}.list{box-shadow:0 1px 24px #1c1c1c0a;background:transparent;contain:inherit;padding:0}ion-list-header{background-color:var(--kirby-white);border-bottom:1px solid var(--kirby-background-color);padding:0;text-transform:inherit;letter-spacing:inherit;font-weight:inherit;font-size:inherit;min-height:0;overflow:inherit}ion-item{--background: var(--kirby-white);--background-activated: var(--kirby-white-shade);--background-hover: var(--kirby-background-color);--background-focused: var(--kirby-background-color);--inner-border-width: 0;--ion-safe-area-right: 0;--min-height: 56px;--padding-bottom: 8px;--padding-end: 16px;--padding-start: 16px;--padding-top: 8px;display:flex;font-size:clamp(12px,.875rem,28px);min-height:56px;overflow:visible;width:100%}ion-item-sliding{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color)}ion-item-sliding.item-sliding-active-slide{backface-visibility:hidden;transform:translateZ(0)}ion-item-sliding.light{--kirby-inputs-background-color: var(--kirby-white);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-divider-color: var(--kirby-medium);--kirby-inputs-elevation: var(--kirby-elevation-2);--kirby-item-background: var(--kirby-light);--kirby-item-background-activated: var(--kirby-light-shade);--kirby-item-background-focused: var(--kirby-light-shade);--kirby-item-background-hover: var(--kirby-light-tint)}ion-item-sliding.light ion-item{--background: var(--kirby-light);--color: var(--kirby-light-contrast);--background-activated: var(--kirby-light-shade);--background-focused: var(--kirby-light-shade);--background-hover: var(--kirby-light-tint)}ion-item-group{margin-bottom:24px}ion-item-group:last-of-type{margin-bottom:0}ion-item-divider{--inner-padding-end: 0;--color: unset;background-color:transparent;border-color:transparent;min-height:0;padding:0 16px 8px;font-weight:inherit}.footer{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color);background-color:var(--kirby-white);border-top:1px solid var(--kirby-background-color);display:flex;align-items:center;justify-content:space-between;width:100%}.no-more-items,.loading{width:100%;padding:24px 0;text-align:center}.swipe-action{display:flex;color:var(--kirby-black);background-color:transparent}.swipe-action ion-item-option{height:100%;display:inline-block;text-align:center}.swipe-action .item-content{display:inline-grid;min-width:70px;flex-direction:column}.swipe-action .item-content ion-label{--background: unset;--color: unset}ion-item-options[side=end]{border-bottom-width:0}:host-context(.has-sections) .list,:host-context(.has-stand-alone) .list{box-shadow:none}:host-context(.has-sections) .list-items,:host-context(.has-stand-alone) .list-items{box-shadow:0 1px 24px #1c1c1c0a;border-radius:var(--kirby-border-radius-n)}:host-context(.has-sections) .footer,:host-context(.has-stand-alone) .footer{background-color:transparent;border-top:none}:host-context(.has-sections) ion-list-header,:host-context(.has-stand-alone) ion-list-header{background-color:transparent;border-bottom:none}:host-context(.shape-rounded) .list,:host-context(.shape-rounded) .list-items{border-radius:var(--kirby-list-border-top-radius) var(--kirby-list-border-top-radius) var(--kirby-list-border-bottom-radius) var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item.first,:host-context(.shape-rounded) ion-item-sliding.first,:host-context(.shape-rounded) ion-list-header{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) ion-list-header{border-top-left-radius:var(--kirby-list-border-top-radius);border-top-right-radius:var(--kirby-list-border-top-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item-sliding{border-top-left-radius:0;border-top-right-radius:0}:host-context(.shape-rounded) ion-item.last,:host-context(.shape-rounded) ion-item-sliding.last,:host-context(.shape-rounded) .footer{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) .footer{border-bottom-left-radius:var(--kirby-list-border-bottom-radius);border-bottom-right-radius:var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item-sliding{border-bottom-left-radius:0;border-bottom-right-radius:0}kirby-list-item{--kirby-content-border-top-radius: 0;--kirby-content-border-bottom-radius: 0}kirby-list-item:first-of-type{--kirby-content-border-top-radius: var(--kirby-list-border-top-radius)}kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: var(--kirby-list-border-bottom-radius)}.has-header kirby-list-item:first-of-type{--kirby-content-border-top-radius: 0}.has-footer kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: 0}:host-context(.shape-none) .list,:host-context(.shape-none) .list-items{box-shadow:none;border-radius:unset;--kirby-item-background: transparent;--kirby-list-item-border-color: var(--kirby-medium)}:host-context(kirby-card){--kirby-list-item-border-color: var(--kirby-background-color)}:host-context(kirby-card.outlined){--kirby-list-item-border-color: var(--kirby-medium)}:host-context(.item-spacing) .list kirby-list-item{margin-bottom:16px}:host-context(.item-spacing) .list kirby-list-item>ion-item,:host-context(.item-spacing) .list kirby-list-item:last-child{margin-bottom:0}.stand-alone-bottom-margin-xxxxxl{margin-bottom:72px}.stand-alone-bottom-margin-xxxxl{margin-bottom:64px}.stand-alone-bottom-margin-xxxl{margin-bottom:56px}.stand-alone-bottom-margin-xxl{margin-bottom:48px}.stand-alone-bottom-margin-xl{margin-bottom:40px}.stand-alone-bottom-margin-l{margin-bottom:32px}.stand-alone-bottom-margin-m{margin-bottom:24px}.stand-alone-bottom-margin-s{margin-bottom:16px}.stand-alone-bottom-margin-xs{margin-bottom:12px}.stand-alone-bottom-margin-xxs{margin-bottom:8px}.stand-alone-bottom-margin-xxxs{margin-bottom:4px}.stand-alone-bottom-margin-xxxxs{margin-bottom:2px}\n", ".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{overflow:hidden}:host-context(.has-divider) ion-item-sliding:not(.last){border-bottom:1px solid var(--kirby-list-item-border-color, var(--kirby-background-color))}\n"] }]
-        }], ctorParameters: () => [{ type: i1$1.PlatformService }], propDecorators: { ionItemSliding: [{
-                type: ViewChild,
-                args: [IonItemSliding]
-            }], item: [{
-                type: Input
-            }], boundaryClass: [{
-                type: Input
-            }], swipeActions: [{
-                type: Input
-            }], itemTemplate: [{
-                type: Input
-            }], isSelected: [{
-                type: Input
-            }], isSelectable: [{
-                type: Input
-            }], getItemColor: [{
-                type: Input
-            }], itemSelect: [{
-                type: Output
-            }], swipeActionSelect: [{
-                type: Output
-            }] } });
-
-class ListSectionHeaderComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListSectionHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: ListSectionHeaderComponent, isStandalone: true, selector: "kirby-list-section-header", inputs: { title: "title" }, ngImport: i0, template: "<div class=\"header\">\n  <span class=\"kirby-text-small\">{{ title }}</span>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListSectionHeaderComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'kirby-list-section-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"header\">\n  <span class=\"kirby-text-small\">{{ title }}</span>\n</div>\n" }]
-        }], propDecorators: { title: [{
-                type: Input
-            }] } });
-
-class ListItemTemplateDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListItemTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.18", type: ListItemTemplateDirective, isStandalone: true, selector: "[kirbyListItemTemplate]", ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListItemTemplateDirective, decorators: [{
-            type: Directive,
-            args: [{ selector: '[kirbyListItemTemplate]' }]
-        }] });
-class ListHeaderDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.18", type: ListHeaderDirective, isStandalone: true, selector: "[kirbyListHeader], [kirbyListHeaderTemplate]", ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListHeaderDirective, decorators: [{
-            type: Directive,
-            args: [{ selector: '[kirbyListHeader], [kirbyListHeaderTemplate]' }]
-        }] });
-class ListSectionHeaderDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListSectionHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.18", type: ListSectionHeaderDirective, isStandalone: true, selector: "[kirbyListSectionHeader], [kirbyListSectionHeaderTemplate]", ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListSectionHeaderDirective, decorators: [{
-            type: Directive,
-            args: [{ selector: '[kirbyListSectionHeader], [kirbyListSectionHeaderTemplate]' }]
-        }] });
-class ListFooterDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListFooterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.18", type: ListFooterDirective, isStandalone: true, selector: "[kirbyListFooter], [kirbyListFooterTemplate]", ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListFooterDirective, decorators: [{
-            type: Directive,
-            args: [{ selector: '[kirbyListFooter], [kirbyListFooterTemplate]' }]
-        }] });
-
-class ListComponent {
-    get isShapeRounded() {
-        return this.shape === 'rounded';
-    }
-    get isShapeNone() {
-        return this.shape === 'none';
-    }
-    constructor(listHelper, element, renderer) {
-        this.listHelper = listHelper;
-        this.element = element;
-        this.renderer = renderer;
-        /**
-         * Provide items for the list to render. Items must be provided in the order you expect them to be rendered.
-         */
-        this.items = [];
-        /**
-         * Bottom margin for stand alone items
-         */
-        this.standAloneSpacing = 'xxs';
-        /**
-         * Determines if dividers (bottom-border on list items) should be shown or not.
-         */
-        this.showDivider = true;
-        /**
-         * Determines if list row text should turn bold on selection
-         */
-        this.markSelectedRow = false;
-        /**
-         * Determine outline shape of:
-         * - list, if {@link #isSectionsEnabled} is `false`
-         * - section, if {@link #isSectionsEnabled} is `true`
-         *
-         * `square` means **without** rounded corners, `rounded` means **with** rounded corners.,  `none` means **without** padding, border, box-shadow and background.
-         */
-        this.shape = 'rounded';
-        /**
-         * Emitting event when more items are to be loaded.
-         */
-        this.loadOnDemand = new EventEmitter();
-        /**
-         * Determines if list items should have swipe actions or not
-         * - the order of swipe actions is used to determine edge actions,
-         * as well as their order of appearance on the screen.
-         */
-        this.swipeActions = [];
-        /**
-         * Emitting event when an item is selected (tapped on mobile, clicked on web)
-         */
-        this.itemSelect = new EventEmitter();
-        this.disableSelectionHighlight = false;
-        this._attributesToForward = ['aria-label', 'aria-labelledby'];
-    }
-    ngOnInit() {
-        this._isSelectable = this.itemSelect.observers.length > 0;
-        if (this.isLoadOnDemandEnabled === undefined) {
-            this.isLoadOnDemandEnabled = this.loadOnDemand.observers.length > 0;
-        }
-    }
-    ngOnChanges() {
-        this._isSectionsEnabled = !!this.getSectionName;
-        this._isStandAloneEnabled = !!this.getStandAloneByProperty;
-        if (this._isSectionsEnabled && this._isStandAloneEnabled) {
-            this._groupedItems = this.listHelper.groupSectionsWithStandAloneItems(this.items, this.getSectionName, this.getStandAloneByProperty);
-        }
-        else if (this._isSectionsEnabled) {
-            this._groupedItems = this.listHelper.groupSections(this.items, this.getSectionName);
-        }
-        else if (this._isStandAloneEnabled) {
-            this._groupedItems = this.listHelper.groupStandAloneItems(this.items, this.getStandAloneByProperty);
-        }
-    }
-    ngAfterViewInit() {
-        forwardAttributes(this.element.nativeElement, this._attributesToForward, this.renderer, this.element.nativeElement.querySelector('ion-list'));
-    }
-    _onLoadOnDemand() {
-        this.listHelper.onLoadOnDemand(this);
-    }
-    sectionTrackBy(index, section) {
-        return section?.name ?? index;
-    }
-    onItemSelect(item) {
-        if (!this.disableSelectionHighlight) {
-            this._selectedItem = item;
-        }
-        this.itemSelect.emit(item);
-    }
-    onSwipeActionSelect(args) {
-        args.swipeAction.onSelected(args.item);
-        this.list.closeSlidingItems();
-        args.event.stopPropagation();
-    }
-    _getBoundaryClass(index, section) {
-        if (index === 0) {
-            if (this.headerTemplate)
-                return null;
-            else
-                return section.length === 1 ? ['first', 'last'] : 'first';
-        }
-        if (index === section.length - 1) {
-            return this.footerTemplate ? null : 'last';
-        }
-        return null;
-    }
-    standAloneClass() {
-        return this._isStandAloneEnabled ? `stand-alone-bottom-margin-${this.standAloneSpacing}` : '';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListComponent, deps: [{ token: ListHelper }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: ListComponent, 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: { properties: { "class.shape-rounded": "this.isShapeRounded", "class.shape-none": "this.isShapeNone", "class.item-spacing": "this.hasItemSpacing", "class.has-sections": "this._isSectionsEnabled", "class.has-stand-alone": "this._isStandAloneEnabled" } }, providers: [ListHelper], queries: [{ propertyName: "headerTemplate", first: true, predicate: ListHeaderDirective, descendants: true, read: TemplateRef }, { propertyName: "sectionHeaderTemplate", first: true, predicate: ListSectionHeaderDirective, descendants: true, read: TemplateRef }, { propertyName: "footerTemplate", first: true, predicate: ListFooterDirective, descendants: true, read: TemplateRef }, { propertyName: "itemTemplate", first: true, predicate: ListItemTemplateDirective, descendants: true, read: TemplateRef, static: true }], viewQueries: [{ propertyName: "list", first: true, predicate: ["list"], descendants: true, static: true }, { propertyName: "scrollDirective", first: true, predicate: InfiniteScrollDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ion-list\n  #list\n  kirbyInfiniteScroll\n  (scrollEnd)=\"_onLoadOnDemand()\"\n  [disabled]=\"!isLoadOnDemandEnabled\"\n  class=\"list\"\n  [class.has-header]=\"headerTemplate\"\n  [class.has-footer]=\"footerTemplate\"\n  [class.has-divider]=\"showDivider\"\n>\n  @if (headerTemplate) {\n    <ion-list-header>\n      <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n    </ion-list-header>\n  }\n\n  <ng-container\n    *ngTemplateOutlet=\"\n      _isSectionsEnabled || _isStandAloneEnabled ? groupedListTemplate : itemsTemplate;\n      context: { $implicit: items }\n    \"\n  ></ng-container>\n\n  @if (footerTemplate) {\n    <div class=\"footer\">\n      <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n    </div>\n  }\n</ion-list>\n\n@if (!isLoadOnDemandEnabled && noMoreItemsText) {\n  <p class=\"no-more-items\">\n    {{ noMoreItemsText }}\n  </p>\n}\n@if (_isLoading) {\n  <div class=\"loading\">\n    <kirby-spinner></kirby-spinner>\n  </div>\n}\n\n<ng-template #groupedListTemplate>\n  @for (section of _groupedItems; track sectionTrackBy($index, section)) {\n    <ion-item-group [ngClass]=\"standAloneClass()\">\n      @if (_isSectionsEnabled) {\n        <ion-item-divider>\n          <ng-container\n            *ngTemplateOutlet=\"sectionHeaderTemplate; context: { $implicit: section.name }\"\n          ></ng-container>\n        </ion-item-divider>\n      }\n      @if (_isSectionsEnabled && _isStandAloneEnabled) {\n        @for (list of section.lists; track list) {\n          <div class=\"list-items\" [ngClass]=\"standAloneClass()\">\n            <ng-container\n              *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: list }\"\n            ></ng-container>\n          </div>\n        }\n      } @else {\n        <div class=\"list-items\" [ngClass]=\"standAloneClass()\">\n          <ng-container\n            *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: section.items }\"\n          ></ng-container>\n        </div>\n      }\n    </ion-item-group>\n  }\n</ng-template>\n\n<ng-template #itemsTemplate let-items>\n  @for (item of items; track trackBy ? trackBy($index, item) : $index; let i = $index) {\n    <kirby-list-item\n      [item]=\"item\"\n      [itemTemplate]=\"itemTemplate\"\n      [swipeActions]=\"swipeActions\"\n      [boundaryClass]=\"_getBoundaryClass(i, items)\"\n      [isSelectable]=\"_isSelectable\"\n      [getItemColor]=\"getItemColor\"\n      [isSelected]=\"_isSelectable && item === _selectedItem\"\n      (itemSelect)=\"onItemSelect($event)\"\n      (swipeActionSelect)=\"onSwipeActionSelect($event)\"\n      [class.is-single]=\"items.length === 1\"\n    ></kirby-list-item>\n  }\n</ng-template>\n", styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}ion-item-option.primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}ion-item-option.secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}ion-item-option.tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}ion-item-option.success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}ion-item-option.warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}ion-item-option.danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}ion-item-option.white-overlay{background-color:var(--kirby-white-overlay);color:var(--kirby-white-overlay-contrast)}ion-item-option.light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}ion-item-option.medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}ion-item-option.dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}ion-item-option.dark-overlay{background-color:var(--kirby-dark-overlay);color:var(--kirby-dark-overlay-contrast)}:host{display:block}:host(:not(kirby-list-item)){--kirby-list-border-top-radius: var( --kirby-content-border-top-radius, var(--kirby-border-radius-n) );--kirby-list-border-bottom-radius: var( --kirby-content-border-bottom-radius, var(--kirby-border-radius-n) )}.list{box-shadow:0 1px 24px #1c1c1c0a;background:transparent;contain:inherit;padding:0}ion-list-header{background-color:var(--kirby-white);border-bottom:1px solid var(--kirby-background-color);padding:0;text-transform:inherit;letter-spacing:inherit;font-weight:inherit;font-size:inherit;min-height:0;overflow:inherit}ion-item{--background: var(--kirby-white);--background-activated: var(--kirby-white-shade);--background-hover: var(--kirby-background-color);--background-focused: var(--kirby-background-color);--inner-border-width: 0;--ion-safe-area-right: 0;--min-height: 56px;--padding-bottom: 8px;--padding-end: 16px;--padding-start: 16px;--padding-top: 8px;display:flex;font-size:clamp(12px,.875rem,28px);min-height:56px;overflow:visible;width:100%}ion-item-sliding{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color)}ion-item-sliding.item-sliding-active-slide{backface-visibility:hidden;transform:translateZ(0)}ion-item-sliding.light{--kirby-inputs-background-color: var(--kirby-white);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-divider-color: var(--kirby-medium);--kirby-inputs-elevation: var(--kirby-elevation-2);--kirby-item-background: var(--kirby-light);--kirby-item-background-activated: var(--kirby-light-shade);--kirby-item-background-focused: var(--kirby-light-shade);--kirby-item-background-hover: var(--kirby-light-tint)}ion-item-sliding.light ion-item{--background: var(--kirby-light);--color: var(--kirby-light-contrast);--background-activated: var(--kirby-light-shade);--background-focused: var(--kirby-light-shade);--background-hover: var(--kirby-light-tint)}ion-item-group{margin-bottom:24px}ion-item-group:last-of-type{margin-bottom:0}ion-item-divider{--inner-padding-end: 0;--color: unset;background-color:transparent;border-color:transparent;min-height:0;padding:0 16px 8px;font-weight:inherit}.footer{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color);background-color:var(--kirby-white);border-top:1px solid var(--kirby-background-color);display:flex;align-items:center;justify-content:space-between;width:100%}.no-more-items,.loading{width:100%;padding:24px 0;text-align:center}.swipe-action{display:flex;color:var(--kirby-black);background-color:transparent}.swipe-action ion-item-option{height:100%;display:inline-block;text-align:center}.swipe-action .item-content{display:inline-grid;min-width:70px;flex-direction:column}.swipe-action .item-content ion-label{--background: unset;--color: unset}ion-item-options[side=end]{border-bottom-width:0}:host-context(.has-sections) .list,:host-context(.has-stand-alone) .list{box-shadow:none}:host-context(.has-sections) .list-items,:host-context(.has-stand-alone) .list-items{box-shadow:0 1px 24px #1c1c1c0a;border-radius:var(--kirby-border-radius-n)}:host-context(.has-sections) .footer,:host-context(.has-stand-alone) .footer{background-color:transparent;border-top:none}:host-context(.has-sections) ion-list-header,:host-context(.has-stand-alone) ion-list-header{background-color:transparent;border-bottom:none}:host-context(.shape-rounded) .list,:host-context(.shape-rounded) .list-items{border-radius:var(--kirby-list-border-top-radius) var(--kirby-list-border-top-radius) var(--kirby-list-border-bottom-radius) var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item.first,:host-context(.shape-rounded) ion-item-sliding.first,:host-context(.shape-rounded) ion-list-header{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) ion-list-header{border-top-left-radius:var(--kirby-list-border-top-radius);border-top-right-radius:var(--kirby-list-border-top-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item-sliding{border-top-left-radius:0;border-top-right-radius:0}:host-context(.shape-rounded) ion-item.last,:host-context(.shape-rounded) ion-item-sliding.last,:host-context(.shape-rounded) .footer{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) .footer{border-bottom-left-radius:var(--kirby-list-border-bottom-radius);border-bottom-right-radius:var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item-sliding{border-bottom-left-radius:0;border-bottom-right-radius:0}kirby-list-item{--kirby-content-border-top-radius: 0;--kirby-content-border-bottom-radius: 0}kirby-list-item:first-of-type{--kirby-content-border-top-radius: var(--kirby-list-border-top-radius)}kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: var(--kirby-list-border-bottom-radius)}.has-header kirby-list-item:first-of-type{--kirby-content-border-top-radius: 0}.has-footer kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: 0}:host-context(.shape-none) .list,:host-context(.shape-none) .list-items{box-shadow:none;border-radius:unset;--kirby-item-background: transparent;--kirby-list-item-border-color: var(--kirby-medium)}:host-context(kirby-card){--kirby-list-item-border-color: var(--kirby-background-color)}:host-context(kirby-card.outlined){--kirby-list-item-border-color: var(--kirby-medium)}:host-context(.item-spacing) .list kirby-list-item{margin-bottom:16px}:host-context(.item-spacing) .list kirby-list-item>ion-item,:host-context(.item-spacing) .list kirby-list-item:last-child{margin-bottom:0}.stand-alone-bottom-margin-xxxxxl{margin-bottom:72px}.stand-alone-bottom-margin-xxxxl{margin-bottom:64px}.stand-alone-bottom-margin-xxxl{margin-bottom:56px}.stand-alone-bottom-margin-xxl{margin-bottom:48px}.stand-alone-bottom-margin-xl{margin-bottom:40px}.stand-alone-bottom-margin-l{margin-bottom:32px}.stand-alone-bottom-margin-m{margin-bottom:24px}.stand-alone-bottom-margin-s{margin-bottom:16px}.stand-alone-bottom-margin-xs{margin-bottom:12px}.stand-alone-bottom-margin-xxs{margin-bottom:8px}.stand-alone-bottom-margin-xxxs{margin-bottom:4px}.stand-alone-bottom-margin-xxxxs{margin-bottom:2px}\n"], dependencies: [{ kind: "component", type: IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "directive", type: InfiniteScrollDirective, selector: "[kirbyInfiniteScroll]", inputs: ["disabled"], outputs: ["scrollEnd"] }, { kind: "component", type: IonListHeader, selector: "ion-list-header", inputs: ["color", "lines", "mode"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SpinnerComponent, selector: "kirby-spinner" }, { kind: "component", type: IonItemGroup, selector: "ion-item-group" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IonItemDivider, selector: "ion-item-divider", inputs: ["color", "mode", "sticky"] }, { kind: "component", type: ListItemComponent, selector: "kirby-list-item", inputs: ["item", "boundaryClass", "swipeActions", "itemTemplate", "isSelected", "isSelectable", "getItemColor"], outputs: ["itemSelect", "swipeActionSelect"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'kirby-list', providers: [ListHelper], imports: [
-                        IonList,
-                        InfiniteScrollDirective,
-                        IonListHeader,
-                        NgTemplateOutlet,
-                        SpinnerComponent,
-                        IonItemGroup,
-                        NgClass,
-                        IonItemDivider,
-                        ListItemComponent,
-                    ], template: "<ion-list\n  #list\n  kirbyInfiniteScroll\n  (scrollEnd)=\"_onLoadOnDemand()\"\n  [disabled]=\"!isLoadOnDemandEnabled\"\n  class=\"list\"\n  [class.has-header]=\"headerTemplate\"\n  [class.has-footer]=\"footerTemplate\"\n  [class.has-divider]=\"showDivider\"\n>\n  @if (headerTemplate) {\n    <ion-list-header>\n      <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n    </ion-list-header>\n  }\n\n  <ng-container\n    *ngTemplateOutlet=\"\n      _isSectionsEnabled || _isStandAloneEnabled ? groupedListTemplate : itemsTemplate;\n      context: { $implicit: items }\n    \"\n  ></ng-container>\n\n  @if (footerTemplate) {\n    <div class=\"footer\">\n      <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n    </div>\n  }\n</ion-list>\n\n@if (!isLoadOnDemandEnabled && noMoreItemsText) {\n  <p class=\"no-more-items\">\n    {{ noMoreItemsText }}\n  </p>\n}\n@if (_isLoading) {\n  <div class=\"loading\">\n    <kirby-spinner></kirby-spinner>\n  </div>\n}\n\n<ng-template #groupedListTemplate>\n  @for (section of _groupedItems; track sectionTrackBy($index, section)) {\n    <ion-item-group [ngClass]=\"standAloneClass()\">\n      @if (_isSectionsEnabled) {\n        <ion-item-divider>\n          <ng-container\n            *ngTemplateOutlet=\"sectionHeaderTemplate; context: { $implicit: section.name }\"\n          ></ng-container>\n        </ion-item-divider>\n      }\n      @if (_isSectionsEnabled && _isStandAloneEnabled) {\n        @for (list of section.lists; track list) {\n          <div class=\"list-items\" [ngClass]=\"standAloneClass()\">\n            <ng-container\n              *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: list }\"\n            ></ng-container>\n          </div>\n        }\n      } @else {\n        <div class=\"list-items\" [ngClass]=\"standAloneClass()\">\n          <ng-container\n            *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: section.items }\"\n          ></ng-container>\n        </div>\n      }\n    </ion-item-group>\n  }\n</ng-template>\n\n<ng-template #itemsTemplate let-items>\n  @for (item of items; track trackBy ? trackBy($index, item) : $index; let i = $index) {\n    <kirby-list-item\n      [item]=\"item\"\n      [itemTemplate]=\"itemTemplate\"\n      [swipeActions]=\"swipeActions\"\n      [boundaryClass]=\"_getBoundaryClass(i, items)\"\n      [isSelectable]=\"_isSelectable\"\n      [getItemColor]=\"getItemColor\"\n      [isSelected]=\"_isSelectable && item === _selectedItem\"\n      (itemSelect)=\"onItemSelect($event)\"\n      (swipeActionSelect)=\"onSwipeActionSelect($event)\"\n      [class.is-single]=\"items.length === 1\"\n    ></kirby-list-item>\n  }\n</ng-template>\n", styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}ion-item-option.primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}ion-item-option.secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}ion-item-option.tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}ion-item-option.success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}ion-item-option.warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}ion-item-option.danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}ion-item-option.white-overlay{background-color:var(--kirby-white-overlay);color:var(--kirby-white-overlay-contrast)}ion-item-option.light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}ion-item-option.medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}ion-item-option.dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}ion-item-option.dark-overlay{background-color:var(--kirby-dark-overlay);color:var(--kirby-dark-overlay-contrast)}:host{display:block}:host(:not(kirby-list-item)){--kirby-list-border-top-radius: var( --kirby-content-border-top-radius, var(--kirby-border-radius-n) );--kirby-list-border-bottom-radius: var( --kirby-content-border-bottom-radius, var(--kirby-border-radius-n) )}.list{box-shadow:0 1px 24px #1c1c1c0a;background:transparent;contain:inherit;padding:0}ion-list-header{background-color:var(--kirby-white);border-bottom:1px solid var(--kirby-background-color);padding:0;text-transform:inherit;letter-spacing:inherit;font-weight:inherit;font-size:inherit;min-height:0;overflow:inherit}ion-item{--background: var(--kirby-white);--background-activated: var(--kirby-white-shade);--background-hover: var(--kirby-background-color);--background-focused: var(--kirby-background-color);--inner-border-width: 0;--ion-safe-area-right: 0;--min-height: 56px;--padding-bottom: 8px;--padding-end: 16px;--padding-start: 16px;--padding-top: 8px;display:flex;font-size:clamp(12px,.875rem,28px);min-height:56px;overflow:visible;width:100%}ion-item-sliding{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color)}ion-item-sliding.item-sliding-active-slide{backface-visibility:hidden;transform:translateZ(0)}ion-item-sliding.light{--kirby-inputs-background-color: var(--kirby-white);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-divider-color: var(--kirby-medium);--kirby-inputs-elevation: var(--kirby-elevation-2);--kirby-item-background: var(--kirby-light);--kirby-item-background-activated: var(--kirby-light-shade);--kirby-item-background-focused: var(--kirby-light-shade);--kirby-item-background-hover: var(--kirby-light-tint)}ion-item-sliding.light ion-item{--background: var(--kirby-light);--color: var(--kirby-light-contrast);--background-activated: var(--kirby-light-shade);--background-focused: var(--kirby-light-shade);--background-hover: var(--kirby-light-tint)}ion-item-group{margin-bottom:24px}ion-item-group:last-of-type{margin-bottom:0}ion-item-divider{--inner-padding-end: 0;--color: unset;background-color:transparent;border-color:transparent;min-height:0;padding:0 16px 8px;font-weight:inherit}.footer{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color);background-color:var(--kirby-white);border-top:1px solid var(--kirby-background-color);display:flex;align-items:center;justify-content:space-between;width:100%}.no-more-items,.loading{width:100%;padding:24px 0;text-align:center}.swipe-action{display:flex;color:var(--kirby-black);background-color:transparent}.swipe-action ion-item-option{height:100%;display:inline-block;text-align:center}.swipe-action .item-content{display:inline-grid;min-width:70px;flex-direction:column}.swipe-action .item-content ion-label{--background: unset;--color: unset}ion-item-options[side=end]{border-bottom-width:0}:host-context(.has-sections) .list,:host-context(.has-stand-alone) .list{box-shadow:none}:host-context(.has-sections) .list-items,:host-context(.has-stand-alone) .list-items{box-shadow:0 1px 24px #1c1c1c0a;border-radius:var(--kirby-border-radius-n)}:host-context(.has-sections) .footer,:host-context(.has-stand-alone) .footer{background-color:transparent;border-top:none}:host-context(.has-sections) ion-list-header,:host-context(.has-stand-alone) ion-list-header{background-color:transparent;border-bottom:none}:host-context(.shape-rounded) .list,:host-context(.shape-rounded) .list-items{border-radius:var(--kirby-list-border-top-radius) var(--kirby-list-border-top-radius) var(--kirby-list-border-bottom-radius) var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item.first,:host-context(.shape-rounded) ion-item-sliding.first,:host-context(.shape-rounded) ion-list-header{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) ion-list-header{border-top-left-radius:var(--kirby-list-border-top-radius);border-top-right-radius:var(--kirby-list-border-top-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item-sliding{border-top-left-radius:0;border-top-right-radius:0}:host-context(.shape-rounded) ion-item.last,:host-context(.shape-rounded) ion-item-sliding.last,:host-context(.shape-rounded) .footer{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) .footer{border-bottom-left-radius:var(--kirby-list-border-bottom-radius);border-bottom-right-radius:var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item-sliding{border-bottom-left-radius:0;border-bottom-right-radius:0}kirby-list-item{--kirby-content-border-top-radius: 0;--kirby-content-border-bottom-radius: 0}kirby-list-item:first-of-type{--kirby-content-border-top-radius: var(--kirby-list-border-top-radius)}kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: var(--kirby-list-border-bottom-radius)}.has-header kirby-list-item:first-of-type{--kirby-content-border-top-radius: 0}.has-footer kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: 0}:host-context(.shape-none) .list,:host-context(.shape-none) .list-items{box-shadow:none;border-radius:unset;--kirby-item-background: transparent;--kirby-list-item-border-color: var(--kirby-medium)}:host-context(kirby-card){--kirby-list-item-border-color: var(--kirby-background-color)}:host-context(kirby-card.outlined){--kirby-list-item-border-color: var(--kirby-medium)}:host-context(.item-spacing) .list kirby-list-item{margin-bottom:16px}:host-context(.item-spacing) .list kirby-list-item>ion-item,:host-context(.item-spacing) .list kirby-list-item:last-child{margin-bottom:0}.stand-alone-bottom-margin-xxxxxl{margin-bottom:72px}.stand-alone-bottom-margin-xxxxl{margin-bottom:64px}.stand-alone-bottom-margin-xxxl{margin-bottom:56px}.stand-alone-bottom-margin-xxl{margin-bottom:48px}.stand-alone-bottom-margin-xl{margin-bottom:40px}.stand-alone-bottom-margin-l{margin-bottom:32px}.stand-alone-bottom-margin-m{margin-bottom:24px}.stand-alone-bottom-margin-s{margin-bottom:16px}.stand-alone-bottom-margin-xs{margin-bottom:12px}.stand-alone-bottom-margin-xxs{margin-bottom:8px}.stand-alone-bottom-margin-xxxs{margin-bottom:4px}.stand-alone-bottom-margin-xxxxs{margin-bottom:2px}\n"] }]
-        }], ctorParameters: () => [{ type: ListHelper }, { type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { list: [{
-                type: ViewChild,
-                args: ['list', { static: true }]
-            }], scrollDirective: [{
-                type: ViewChild,
-                args: [InfiniteScrollDirective]
-            }], items: [{
-                type: Input
-            }], getItemColor: [{
-                type: Input
-            }], getSectionName: [{
-                type: Input
-            }], trackBy: [{
-                type: Input
-            }], getStandAloneByProperty: [{
-                type: Input
-            }], standAloneSpacing: [{
-                type: Input
-            }], noMoreItemsText: [{
-                type: Input
-            }], showDivider: [{
-                type: Input
-            }], markSelectedRow: [{
-                type: Input
-            }], shape: [{
-                type: Input
-            }], isShapeRounded: [{
-                type: HostBinding,
-                args: ['class.shape-rounded']
-            }], isShapeNone: [{
-                type: HostBinding,
-                args: ['class.shape-none']
-            }], hasItemSpacing: [{
-                type: HostBinding,
-                args: ['class.item-spacing']
-            }, {
-                type: Input
-            }], isLoadOnDemandEnabled: [{
-                type: Input
-            }], loadOnDemand: [{
-                type: Output
-            }], swipeActions: [{
-                type: Input
-            }], itemSelect: [{
-                type: Output
-            }], disableSelectionHighlight: [{
-                type: Input
-            }], headerTemplate: [{
-                type: ContentChild,
-                args: [ListHeaderDirective, { static: false, read: TemplateRef }]
-            }], sectionHeaderTemplate: [{
-                type: ContentChild,
-                args: [ListSectionHeaderDirective, { static: false, read: TemplateRef }]
-            }], footerTemplate: [{
-                type: ContentChild,
-                args: [ListFooterDirective, { static: false, read: TemplateRef }]
-            }], itemTemplate: [{
-                type: ContentChild,
-                args: [ListItemTemplateDirective, { static: true, read: TemplateRef }]
-            }], _isSectionsEnabled: [{
-                type: HostBinding,
-                args: ['class.has-sections']
-            }], _isStandAloneEnabled: [{
-                type: HostBinding,
-                args: ['class.has-stand-alone']
-            }] } });
-
+var InfiniteScrollDirective = class InfiniteScrollDirective {
+	constructor(elementRef, windowRef, zone) {
+		this.elementRef = elementRef;
+		this.windowRef = windowRef;
+		this.zone = zone;
+		this.scrollEnd = new EventEmitter();
+		this.disabled = false;
+		this.scroll$ = new Subject();
+		this.ngUnsubscribe$ = new Subject();
+		this.offset = .8;
+	}
+	ngAfterViewInit() {
+		this.scroll$.pipe(takeUntil(this.ngUnsubscribe$), debounceTime(100), filter(() => !this.disabled), filter((scroll) => {
+			return scroll.elementHeight * (1 - this.offset) >= scroll.distanceToViewBottom - scroll.viewHeight;
+		})).subscribe(() => {
+			this.scrollEnd.emit();
+		});
+		setTimeout(() => {
+			const ionContent = this.elementRef.nativeElement.closest("ion-content");
+			if (ionContent) this.zone.runOutsideAngular(() => {
+				fromEvent(ionContent, "ionScroll").pipe(takeUntil(this.ngUnsubscribe$), debounceTime(100), filter(() => !this.disabled), map(() => this.getScroll()), filter((scroll) => {
+					return scroll.elementHeight * (1 - this.offset) >= scroll.distanceToViewBottom - scroll.viewHeight;
+				})).subscribe(() => {
+					this.zone.run(() => this.scrollEnd.emit());
+				});
+			});
+		});
+	}
+	onScroll() {
+		if (this.disabled) return;
+		const scroll = this.getScroll();
+		this.scroll$.next(scroll);
+	}
+	ngOnDestroy() {
+		this.ngUnsubscribe$.next();
+		this.ngUnsubscribe$.complete();
+	}
+	getScroll() {
+		const boundindClientRect = this.elementRef.nativeElement.getBoundingClientRect();
+		return {
+			distanceToViewBottom: boundindClientRect.bottom,
+			elementHeight: boundindClientRect.height,
+			viewHeight: this.windowRef.nativeWindow.innerHeight
+		};
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: InfiniteScrollDirective,
+			deps: [
+				{ token: i0.ElementRef },
+				{ token: i1$1.WindowRef },
+				{ token: i0.NgZone }
+			],
+			target: i0.ɵɵFactoryTarget.Directive
+		});
+	}
+	static {
+		this.ɵdir = i0.ɵɵngDeclareDirective({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: InfiniteScrollDirective,
+			isStandalone: true,
+			selector: "[kirbyInfiniteScroll]",
+			inputs: { disabled: "disabled" },
+			outputs: { scrollEnd: "scrollEnd" },
+			host: { listeners: { "window:scroll": "onScroll()" } },
+			ngImport: i0
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: InfiniteScrollDirective,
+	decorators: [{
+		type: Directive,
+		args: [{ selector: "[kirbyInfiniteScroll]" }]
+	}],
+	ctorParameters: () => [
+		{ type: i0.ElementRef },
+		{ type: i1$1.WindowRef },
+		{ type: i0.NgZone }
+	],
+	propDecorators: {
+		scrollEnd: [{ type: Output }],
+		disabled: [{ type: Input }],
+		onScroll: [{
+			type: HostListener,
+			args: ["window:scroll"]
+		}]
+	}
+});
+var ListItemColorDirective = class ListItemColorDirective {
+	ngOnChanges() {
+		this.color = this.getColor();
+	}
+	getColor() {
+		if (!this.kirbyListItemColor || !this.item) return;
+		return this.kirbyListItemColor(this.item);
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListItemColorDirective,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Directive
+		});
+	}
+	static {
+		this.ɵdir = i0.ɵɵngDeclareDirective({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: ListItemColorDirective,
+			isStandalone: true,
+			selector: "[kirbyListItemColor]",
+			inputs: {
+				kirbyListItemColor: "kirbyListItemColor",
+				item: "item"
+			},
+			host: { properties: { "class": "this.color" } },
+			usesOnChanges: true,
+			ngImport: i0
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ListItemColorDirective,
+	decorators: [{
+		type: Directive,
+		args: [{ selector: "[kirbyListItemColor]" }]
+	}],
+	propDecorators: {
+		kirbyListItemColor: [{ type: Input }],
+		item: [{ type: Input }],
+		color: [{
+			type: HostBinding,
+			args: ["class"]
+		}]
+	}
+});
+var ListHelper = class ListHelper {
+	onLoadOnDemand(component) {
+		if (component.isLoadOnDemandEnabled && !component._isLoading) {
+			component._isLoading = true;
+			component.loadOnDemand.emit({ complete: (disableLoadOnDemand) => {
+				component.isLoadOnDemandEnabled = !disableLoadOnDemand;
+				component._isLoading = false;
+			} });
+		}
+	}
+	groupSections(items, getGroupName) {
+		const groupsMap = /* @__PURE__ */ new Map();
+		items.forEach((item) => {
+			const itemGroup = getGroupName(item);
+			const groupItems = groupsMap.get(itemGroup);
+			if (groupItems) groupItems.push(item);
+			else groupsMap.set(itemGroup, [item]);
+		});
+		return Array.from(groupsMap).sort(([name], [otherName]) => name.localeCompare(otherName)).map(([name, items]) => {
+			return {
+				name,
+				items
+			};
+		});
+	}
+	groupStandAloneItems(items, standAloneProperty) {
+		return items.reduce((accumulator, item) => {
+			const lastList = accumulator[accumulator.length - 1];
+			const lastItemInList = lastList[lastList.length - 1];
+			if (!lastItemInList) lastList.push(item);
+			else if (!item[standAloneProperty] && !lastItemInList[standAloneProperty]) lastList.push(item);
+			else accumulator.push([item]);
+			return accumulator;
+		}, [[]]).map((items) => {
+			return { items };
+		});
+	}
+	groupSectionsWithStandAloneItems(items, getGroupName, standAloneProperty) {
+		const sectionsMap = /* @__PURE__ */ new Map();
+		items.forEach((item) => {
+			const sectionName = getGroupName(item);
+			if (sectionsMap.has(sectionName)) {
+				const section = sectionsMap.get(sectionName);
+				const lastListInSection = section[section.length - 1];
+				const lastItemInList = lastListInSection[lastListInSection.length - 1];
+				if (!item[standAloneProperty] && !lastItemInList[standAloneProperty]) lastListInSection.push(item);
+				else section.push([item]);
+			} else sectionsMap.set(sectionName, [[item]]);
+		});
+		return Array.from(sectionsMap).sort(([name], [otherName]) => name.localeCompare(otherName)).map(([name, lists]) => {
+			return {
+				name,
+				lists
+			};
+		});
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListHelper,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Injectable
+		});
+	}
+	static {
+		this.ɵprov = i0.ɵɵngDeclareInjectable({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListHelper
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ListHelper,
+	decorators: [{ type: Injectable }]
+});
+var ListExperimentalComponent = class ListExperimentalComponent {
+	closeAllSlidingItems(e) {
+		if (elementHasAncestor(e.target, "ion-item-option", "ion-list")) this.list.closeSlidingItems();
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListExperimentalComponent,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: ListExperimentalComponent,
+			isStandalone: true,
+			selector: "kirby-list-experimental",
+			host: { listeners: { "click": "closeAllSlidingItems($event)" } },
+			viewQueries: [{
+				propertyName: "list",
+				first: true,
+				predicate: IonList,
+				descendants: true,
+				static: true
+			}],
+			ngImport: i0,
+			template: "<ng-content select=\"[outside]\"></ng-content>\n<div class=\"rounded shadow first-item-padding last-item-padding\">\n  <ng-content></ng-content>\n</div>\n",
+			styles: [".rounded{border-top-left-radius:var(--kirby-border-radius-n);border-top-right-radius:var(--kirby-border-radius-n);border-bottom-left-radius:var(--kirby-border-radius-n);border-bottom-right-radius:var(--kirby-border-radius-n);overflow:hidden}.shadow{box-shadow:var(--kirby-elevation-2)}.first-item-padding>::ng-deep :first-child{--item-padding-top: var(--kirby-spacing-xxs)}.last-item-padding>::ng-deep :last-child{--item-padding-bottom: var(--kirby-spacing-xxs)}.first-item{border-top-left-radius:var(--kirby-border-radius-n);border-top-right-radius:var(--kirby-border-radius-n);overflow:hidden}.first-item>::ng-deep :first-child{--item-padding-top: var(--kirby-spacing-xxs)}.last-item{border-bottom-left-radius:var(--kirby-border-radius-n);border-bottom-right-radius:var(--kirby-border-radius-n);overflow:hidden}.last-item>::ng-deep :last-child{--item-padding-bottom: var(--kirby-spacing-xxs)}:host{display:block}\n"],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ListExperimentalComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "kirby-list-experimental",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<ng-content select=\"[outside]\"></ng-content>\n<div class=\"rounded shadow first-item-padding last-item-padding\">\n  <ng-content></ng-content>\n</div>\n",
+			styles: [".rounded{border-top-left-radius:var(--kirby-border-radius-n);border-top-right-radius:var(--kirby-border-radius-n);border-bottom-left-radius:var(--kirby-border-radius-n);border-bottom-right-radius:var(--kirby-border-radius-n);overflow:hidden}.shadow{box-shadow:var(--kirby-elevation-2)}.first-item-padding>::ng-deep :first-child{--item-padding-top: var(--kirby-spacing-xxs)}.last-item-padding>::ng-deep :last-child{--item-padding-bottom: var(--kirby-spacing-xxs)}.first-item{border-top-left-radius:var(--kirby-border-radius-n);border-top-right-radius:var(--kirby-border-radius-n);overflow:hidden}.first-item>::ng-deep :first-child{--item-padding-top: var(--kirby-spacing-xxs)}.last-item{border-bottom-left-radius:var(--kirby-border-radius-n);border-bottom-right-radius:var(--kirby-border-radius-n);overflow:hidden}.last-item>::ng-deep :last-child{--item-padding-bottom: var(--kirby-spacing-xxs)}:host{display:block}\n"]
+		}]
+	}],
+	propDecorators: {
+		list: [{
+			type: ViewChild,
+			args: [IonList, { static: true }]
+		}],
+		closeAllSlidingItems: [{
+			type: HostListener,
+			args: ["click", ["$event"]]
+		}]
+	}
+});
+var ListHeaderComponent = class ListHeaderComponent {
+	constructor() {}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListHeaderComponent,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: ListHeaderComponent,
+			isStandalone: true,
+			selector: "kirby-list-header",
+			ngImport: i0,
+			template: "<ng-content></ng-content>\n",
+			styles: [":host{background-color:transparent;display:flex;flex-direction:row;justify-content:space-between;width:100%;padding:var(--kirby-spacing-m)}\n"],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ListHeaderComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "kirby-list-header",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<ng-content></ng-content>\n",
+			styles: [":host{background-color:transparent;display:flex;flex-direction:row;justify-content:space-between;width:100%;padding:var(--kirby-spacing-m)}\n"]
+		}]
+	}],
+	ctorParameters: () => []
+});
+var ListItemComponent = class ListItemComponent {
+	constructor(platform) {
+		this.platform = platform;
+		this._isSwipingEnabled = false;
+		this.swipeActions = [];
+		this.itemSelect = new EventEmitter();
+		this.swipeActionSelect = new EventEmitter();
+		this.initializeSwipeActions();
+	}
+	_onItemSelect(item) {
+		if (!this.isSelectable) return;
+		this.itemSelect.emit(item);
+	}
+	_onSwipeActionSelect(swipeAction, item, event) {
+		this.swipeActionSelect.emit({
+			swipeAction,
+			item,
+			event
+		});
+	}
+	ngOnInit() {
+		this.initializeSwipeActions();
+	}
+	ngAfterViewInit() {
+		if (!this.itemTemplate) console.warn("No item template was provided.");
+	}
+	_hasSwipeActions(item) {
+		if (!Array.isArray(this.swipeActions)) return false;
+		return this.swipeActions.some((swipeAction) => {
+			if (swipeAction.isDisabled instanceof Function && swipeAction.isDisabled(item)) return false;
+			if (swipeAction.isDisabled === true) return false;
+			return swipeAction.position === "left" || swipeAction.position === "right";
+		});
+	}
+	_getSwipeActions(item, direction) {
+		if (!Array.isArray(this.swipeActions)) return [];
+		return this.swipeActions.filter((swipeAction) => {
+			if (this.isSwipeActionDisabled(swipeAction, item)) return false;
+			return direction ? swipeAction.position === direction : true;
+		});
+	}
+	isSwipeActionDisabled(swipeAction, item) {
+		if (swipeAction.isDisabled instanceof Function && swipeAction.isDisabled(item)) return true;
+		return swipeAction.isDisabled === true;
+	}
+	_getSwipeActionEnd(item) {
+		if (this._getSwipeActions(item, "left").length) return "start";
+		return "end";
+	}
+	_getSwipeActionIcon(swipeAction, item) {
+		if (!swipeAction.icon) return;
+		if (swipeAction.icon instanceof Function) return swipeAction.icon(item);
+		return swipeAction.icon;
+	}
+	_getSwipeActionTitle(swipeAction, item) {
+		if (swipeAction.title instanceof Function) return swipeAction.title(item);
+		return swipeAction.title;
+	}
+	_getSwipeActionType(swipeAction, item) {
+		if (swipeAction.type instanceof Function) return swipeAction.type(item);
+		return swipeAction.type;
+	}
+	initializeSwipeActions() {
+		if (this.swipeActions && this.swipeActions.length) this._isSwipingEnabled = this.platform.isTouch();
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListItemComponent,
+			deps: [{ token: i1.PlatformService }],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "17.0.0",
+			version: "22.2.2",
+			type: ListItemComponent,
+			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"
+			},
+			viewQueries: [{
+				propertyName: "ionItemSliding",
+				first: true,
+				predicate: IonItemSliding,
+				descendants: true
+			}],
+			ngImport: i0,
+			template: "<ion-item-sliding\n  [class.selected]=\"isSelected\"\n  [kirbyListItemColor]=\"getItemColor\"\n  [item]=\"item\"\n  [disabled]=\"_isSwipingEnabled ? null : true\"\n  keyHandler\n  [ngClass]=\"boundaryClass\"\n  (click)=\"_onItemSelect(item)\"\n>\n  <ng-container\n    *ngTemplateOutlet=\"swipeActionsTemplate; context: { $implicit: item }\"\n  ></ng-container>\n  <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n</ion-item-sliding>\n\n<ng-template #swipeActionsTemplate let-item>\n  @if (_hasSwipeActions(item)) {\n    <ion-item-options [side]=\"_getSwipeActionEnd(item)\">\n      <div class=\"swipe-action\">\n        @for (swipeAction of _getSwipeActions(item); track swipeAction.title) {\n          <ion-item-option\n            [ngClass]=\"_getSwipeActionType(swipeAction, item)\"\n            (click)=\"_onSwipeActionSelect(swipeAction, item, $event)\"\n          >\n            <div class=\"item-content\">\n              @if (_getSwipeActionIcon(swipeAction, item)) {\n                <kirby-icon size=\"sm\" [name]=\"_getSwipeActionIcon(swipeAction, item)\"></kirby-icon>\n              }\n              <ion-label>\n                {{ _getSwipeActionTitle(swipeAction, item) }}\n              </ion-label>\n            </div>\n          </ion-item-option>\n        }\n      </div>\n    </ion-item-options>\n  }\n</ng-template>\n",
+			styles: ["ion-item-option.primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}ion-item-option.secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}ion-item-option.tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}ion-item-option.success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}ion-item-option.warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}ion-item-option.danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}ion-item-option.white-overlay{background-color:var(--kirby-white-overlay);color:var(--kirby-white-overlay-contrast)}ion-item-option.light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}ion-item-option.medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}ion-item-option.dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}ion-item-option.dark-overlay{background-color:var(--kirby-dark-overlay);color:var(--kirby-dark-overlay-contrast)}:host{display:block}:host(:not(kirby-list-item)){--kirby-list-border-top-radius: var( --kirby-content-border-top-radius, var(--kirby-border-radius-n) );--kirby-list-border-bottom-radius: var( --kirby-content-border-bottom-radius, var(--kirby-border-radius-n) )}.list{box-shadow:var(--kirby-elevation-2);background:transparent;contain:inherit;padding:0}ion-list-header{background-color:var(--kirby-white);border-bottom:1px solid var(--kirby-background-color);padding:0;text-transform:inherit;letter-spacing:inherit;font-weight:inherit;font-size:inherit;min-height:0;overflow:inherit}ion-item{--background: var(--kirby-white);--background-activated: var(--kirby-white-shade);--background-hover: var(--kirby-background-color);--background-focused: var(--kirby-background-color);--inner-border-width: 0;--ion-safe-area-right: 0;--min-height: var(--kirby-spacing-xxxl);--padding-bottom: var(--kirby-spacing-xxs);--padding-end: var(--kirby-spacing-s);--padding-start: var(--kirby-spacing-s);--padding-top: var(--kirby-spacing-xxs);display:flex;font-size:var(--kirby-font-size-s);min-height:var(--kirby-spacing-xxxl);overflow:visible;width:100%}ion-item-sliding{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color)}ion-item-sliding.item-sliding-active-slide{backface-visibility:hidden;transform:translateZ(0)}ion-item-sliding.light{--kirby-inputs-background-color: var(--kirby-white);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-divider-color: var(--kirby-medium);--kirby-inputs-elevation: var(--kirby-elevation-2);--kirby-item-background: var(--kirby-light);--kirby-item-background-activated: var(--kirby-light-shade);--kirby-item-background-focused: var(--kirby-light-shade);--kirby-item-background-hover: var(--kirby-light-tint)}ion-item-sliding.light ion-item{--background: var(--kirby-light);--color: var(--kirby-light-contrast);--background-activated: var(--kirby-light-shade);--background-focused: var(--kirby-light-shade);--background-hover: var(--kirby-light-tint)}ion-item-group{margin-bottom:var(--kirby-spacing-m)}ion-item-group:last-of-type{margin-bottom:0}ion-item-divider{--inner-padding-end: 0;--color: unset;background-color:transparent;border-color:transparent;min-height:0;padding:0 var(--kirby-spacing-s) var(--kirby-spacing-xxs) var(--kirby-spacing-s);font-weight:inherit}.footer{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color);background-color:var(--kirby-white);border-top:1px solid var(--kirby-background-color);display:flex;align-items:center;justify-content:space-between;width:100%}.no-more-items,.loading{width:100%;padding:var(--kirby-spacing-m) 0;text-align:center}.swipe-action{display:flex;color:var(--kirby-black);background-color:transparent}.swipe-action ion-item-option{height:100%;display:inline-block;text-align:center}.swipe-action .item-content{display:inline-grid;min-width:70px;flex-direction:column}.swipe-action .item-content ion-label{--background: unset;--color: unset}ion-item-options[side=end]{border-bottom-width:0}:host-context(.has-sections) .list,:host-context(.has-stand-alone) .list{box-shadow:none}:host-context(.has-sections) .list-items,:host-context(.has-stand-alone) .list-items{box-shadow:var(--kirby-elevation-2);border-radius:var(--kirby-border-radius-n)}:host-context(.has-sections) .footer,:host-context(.has-stand-alone) .footer{background-color:transparent;border-top:none}:host-context(.has-sections) ion-list-header,:host-context(.has-stand-alone) ion-list-header{background-color:transparent;border-bottom:none}:host-context(.shape-rounded) .list,:host-context(.shape-rounded) .list-items{border-radius:var(--kirby-list-border-top-radius) var(--kirby-list-border-top-radius) var(--kirby-list-border-bottom-radius) var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item.first,:host-context(.shape-rounded) ion-item-sliding.first,:host-context(.shape-rounded) ion-list-header{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) ion-list-header{border-top-left-radius:var(--kirby-list-border-top-radius);border-top-right-radius:var(--kirby-list-border-top-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item-sliding{border-top-left-radius:0;border-top-right-radius:0}:host-context(.shape-rounded) ion-item.last,:host-context(.shape-rounded) ion-item-sliding.last,:host-context(.shape-rounded) .footer{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) .footer{border-bottom-left-radius:var(--kirby-list-border-bottom-radius);border-bottom-right-radius:var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item-sliding{border-bottom-left-radius:0;border-bottom-right-radius:0}kirby-list-item{--kirby-content-border-top-radius: 0;--kirby-content-border-bottom-radius: 0}kirby-list-item:first-of-type{--kirby-content-border-top-radius: var(--kirby-list-border-top-radius)}kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: var(--kirby-list-border-bottom-radius)}.has-header kirby-list-item:first-of-type{--kirby-content-border-top-radius: 0}.has-footer kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: 0}:host-context(.shape-none) .list,:host-context(.shape-none) .list-items{box-shadow:none;border-radius:unset;--kirby-item-background: transparent;--kirby-list-item-border-color: var(--kirby-medium)}:host-context(kirby-card){--kirby-list-item-border-color: var(--kirby-background-color)}:host-context(kirby-card.outlined){--kirby-list-item-border-color: var(--kirby-medium)}:host-context(.item-spacing) .list kirby-list-item{margin-bottom:var(--kirby-spacing-s)}:host-context(.item-spacing) .list kirby-list-item>ion-item,:host-context(.item-spacing) .list kirby-list-item:last-child{margin-bottom:0}.stand-alone-bottom-margin-xxxxs{margin-bottom:var(--kirby-spacing-xxxxs)}.stand-alone-bottom-margin-xxxs{margin-bottom:var(--kirby-spacing-xxxs)}.stand-alone-bottom-margin-xxs{margin-bottom:var(--kirby-spacing-xxs)}.stand-alone-bottom-margin-xs{margin-bottom:var(--kirby-spacing-xs)}.stand-alone-bottom-margin-sm{margin-bottom:var(--kirby-spacing-s)}.stand-alone-bottom-margin-md{margin-bottom:var(--kirby-spacing-m)}.stand-alone-bottom-margin-lg{margin-bottom:var(--kirby-spacing-l)}.stand-alone-bottom-margin-xl{margin-bottom:var(--kirby-spacing-xl)}.stand-alone-bottom-margin-xxl{margin-bottom:var(--kirby-spacing-xxl)}.stand-alone-bottom-margin-xxxl{margin-bottom:var(--kirby-spacing-xxxl)}\n", ":host{overflow:hidden}:host-context(.has-divider) ion-item-sliding:not(.last){border-bottom:1px solid var(--kirby-list-item-border-color, var(--kirby-background-color))}\n"],
+			dependencies: [
+				{
+					kind: "component",
+					type: IonItemSliding,
+					selector: "ion-item-sliding",
+					inputs: ["disabled"],
+					outputs: ["ionDrag"]
+				},
+				{
+					kind: "directive",
+					type: ListItemColorDirective,
+					selector: "[kirbyListItemColor]",
+					inputs: ["kirbyListItemColor", "item"]
+				},
+				{
+					kind: "directive",
+					type: NgClass,
+					selector: "[ngClass]",
+					inputs: ["class", "ngClass"]
+				},
+				{
+					kind: "directive",
+					type: NgTemplateOutlet,
+					selector: "[ngTemplateOutlet]",
+					inputs: [
+						"ngTemplateOutletContext",
+						"ngTemplateOutlet",
+						"ngTemplateOutletInjector"
+					]
+				},
+				{
+					kind: "component",
+					type: IonItemOptions,
+					selector: "ion-item-options",
+					inputs: ["side"],
+					outputs: ["ionSwipe"]
+				},
+				{
+					kind: "component",
+					type: IconComponent,
+					selector: "kirby-icon",
+					inputs: ["size", "name"]
+				},
+				{
+					kind: "component",
+					type: IonLabel,
+					selector: "ion-label",
+					inputs: [
+						"color",
+						"mode",
+						"position"
+					]
+				}
+			],
+			changeDetection: i0.ChangeDetectionStrategy.Eager
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ListItemComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "kirby-list-item",
+			imports: [
+				IonItemSliding,
+				ListItemColorDirective,
+				NgClass,
+				NgTemplateOutlet,
+				IonItemOptions,
+				IconComponent,
+				IonLabel
+			],
+			changeDetection: ChangeDetectionStrategy.Eager,
+			template: "<ion-item-sliding\n  [class.selected]=\"isSelected\"\n  [kirbyListItemColor]=\"getItemColor\"\n  [item]=\"item\"\n  [disabled]=\"_isSwipingEnabled ? null : true\"\n  keyHandler\n  [ngClass]=\"boundaryClass\"\n  (click)=\"_onItemSelect(item)\"\n>\n  <ng-container\n    *ngTemplateOutlet=\"swipeActionsTemplate; context: { $implicit: item }\"\n  ></ng-container>\n  <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n</ion-item-sliding>\n\n<ng-template #swipeActionsTemplate let-item>\n  @if (_hasSwipeActions(item)) {\n    <ion-item-options [side]=\"_getSwipeActionEnd(item)\">\n      <div class=\"swipe-action\">\n        @for (swipeAction of _getSwipeActions(item); track swipeAction.title) {\n          <ion-item-option\n            [ngClass]=\"_getSwipeActionType(swipeAction, item)\"\n            (click)=\"_onSwipeActionSelect(swipeAction, item, $event)\"\n          >\n            <div class=\"item-content\">\n              @if (_getSwipeActionIcon(swipeAction, item)) {\n                <kirby-icon size=\"sm\" [name]=\"_getSwipeActionIcon(swipeAction, item)\"></kirby-icon>\n              }\n              <ion-label>\n                {{ _getSwipeActionTitle(swipeAction, item) }}\n              </ion-label>\n            </div>\n          </ion-item-option>\n        }\n      </div>\n    </ion-item-options>\n  }\n</ng-template>\n",
+			styles: ["ion-item-option.primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}ion-item-option.secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}ion-item-option.tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}ion-item-option.success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}ion-item-option.warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}ion-item-option.danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}ion-item-option.white-overlay{background-color:var(--kirby-white-overlay);color:var(--kirby-white-overlay-contrast)}ion-item-option.light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}ion-item-option.medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}ion-item-option.dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}ion-item-option.dark-overlay{background-color:var(--kirby-dark-overlay);color:var(--kirby-dark-overlay-contrast)}:host{display:block}:host(:not(kirby-list-item)){--kirby-list-border-top-radius: var( --kirby-content-border-top-radius, var(--kirby-border-radius-n) );--kirby-list-border-bottom-radius: var( --kirby-content-border-bottom-radius, var(--kirby-border-radius-n) )}.list{box-shadow:var(--kirby-elevation-2);background:transparent;contain:inherit;padding:0}ion-list-header{background-color:var(--kirby-white);border-bottom:1px solid var(--kirby-background-color);padding:0;text-transform:inherit;letter-spacing:inherit;font-weight:inherit;font-size:inherit;min-height:0;overflow:inherit}ion-item{--background: var(--kirby-white);--background-activated: var(--kirby-white-shade);--background-hover: var(--kirby-background-color);--background-focused: var(--kirby-background-color);--inner-border-width: 0;--ion-safe-area-right: 0;--min-height: var(--kirby-spacing-xxxl);--padding-bottom: var(--kirby-spacing-xxs);--padding-end: var(--kirby-spacing-s);--padding-start: var(--kirby-spacing-s);--padding-top: var(--kirby-spacing-xxs);display:flex;font-size:var(--kirby-font-size-s);min-height:var(--kirby-spacing-xxxl);overflow:visible;width:100%}ion-item-sliding{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color)}ion-item-sliding.item-sliding-active-slide{backface-visibility:hidden;transform:translateZ(0)}ion-item-sliding.light{--kirby-inputs-background-color: var(--kirby-white);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-divider-color: var(--kirby-medium);--kirby-inputs-elevation: var(--kirby-elevation-2);--kirby-item-background: var(--kirby-light);--kirby-item-background-activated: var(--kirby-light-shade);--kirby-item-background-focused: var(--kirby-light-shade);--kirby-item-background-hover: var(--kirby-light-tint)}ion-item-sliding.light ion-item{--background: var(--kirby-light);--color: var(--kirby-light-contrast);--background-activated: var(--kirby-light-shade);--background-focused: var(--kirby-light-shade);--background-hover: var(--kirby-light-tint)}ion-item-group{margin-bottom:var(--kirby-spacing-m)}ion-item-group:last-of-type{margin-bottom:0}ion-item-divider{--inner-padding-end: 0;--color: unset;background-color:transparent;border-color:transparent;min-height:0;padding:0 var(--kirby-spacing-s) var(--kirby-spacing-xxs) var(--kirby-spacing-s);font-weight:inherit}.footer{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color);background-color:var(--kirby-white);border-top:1px solid var(--kirby-background-color);display:flex;align-items:center;justify-content:space-between;width:100%}.no-more-items,.loading{width:100%;padding:var(--kirby-spacing-m) 0;text-align:center}.swipe-action{display:flex;color:var(--kirby-black);background-color:transparent}.swipe-action ion-item-option{height:100%;display:inline-block;text-align:center}.swipe-action .item-content{display:inline-grid;min-width:70px;flex-direction:column}.swipe-action .item-content ion-label{--background: unset;--color: unset}ion-item-options[side=end]{border-bottom-width:0}:host-context(.has-sections) .list,:host-context(.has-stand-alone) .list{box-shadow:none}:host-context(.has-sections) .list-items,:host-context(.has-stand-alone) .list-items{box-shadow:var(--kirby-elevation-2);border-radius:var(--kirby-border-radius-n)}:host-context(.has-sections) .footer,:host-context(.has-stand-alone) .footer{background-color:transparent;border-top:none}:host-context(.has-sections) ion-list-header,:host-context(.has-stand-alone) ion-list-header{background-color:transparent;border-bottom:none}:host-context(.shape-rounded) .list,:host-context(.shape-rounded) .list-items{border-radius:var(--kirby-list-border-top-radius) var(--kirby-list-border-top-radius) var(--kirby-list-border-bottom-radius) var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item.first,:host-context(.shape-rounded) ion-item-sliding.first,:host-context(.shape-rounded) ion-list-header{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) ion-list-header{border-top-left-radius:var(--kirby-list-border-top-radius);border-top-right-radius:var(--kirby-list-border-top-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item-sliding{border-top-left-radius:0;border-top-right-radius:0}:host-context(.shape-rounded) ion-item.last,:host-context(.shape-rounded) ion-item-sliding.last,:host-context(.shape-rounded) .footer{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) .footer{border-bottom-left-radius:var(--kirby-list-border-bottom-radius);border-bottom-right-radius:var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item-sliding{border-bottom-left-radius:0;border-bottom-right-radius:0}kirby-list-item{--kirby-content-border-top-radius: 0;--kirby-content-border-bottom-radius: 0}kirby-list-item:first-of-type{--kirby-content-border-top-radius: var(--kirby-list-border-top-radius)}kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: var(--kirby-list-border-bottom-radius)}.has-header kirby-list-item:first-of-type{--kirby-content-border-top-radius: 0}.has-footer kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: 0}:host-context(.shape-none) .list,:host-context(.shape-none) .list-items{box-shadow:none;border-radius:unset;--kirby-item-background: transparent;--kirby-list-item-border-color: var(--kirby-medium)}:host-context(kirby-card){--kirby-list-item-border-color: var(--kirby-background-color)}:host-context(kirby-card.outlined){--kirby-list-item-border-color: var(--kirby-medium)}:host-context(.item-spacing) .list kirby-list-item{margin-bottom:var(--kirby-spacing-s)}:host-context(.item-spacing) .list kirby-list-item>ion-item,:host-context(.item-spacing) .list kirby-list-item:last-child{margin-bottom:0}.stand-alone-bottom-margin-xxxxs{margin-bottom:var(--kirby-spacing-xxxxs)}.stand-alone-bottom-margin-xxxs{margin-bottom:var(--kirby-spacing-xxxs)}.stand-alone-bottom-margin-xxs{margin-bottom:var(--kirby-spacing-xxs)}.stand-alone-bottom-margin-xs{margin-bottom:var(--kirby-spacing-xs)}.stand-alone-bottom-margin-sm{margin-bottom:var(--kirby-spacing-s)}.stand-alone-bottom-margin-md{margin-bottom:var(--kirby-spacing-m)}.stand-alone-bottom-margin-lg{margin-bottom:var(--kirby-spacing-l)}.stand-alone-bottom-margin-xl{margin-bottom:var(--kirby-spacing-xl)}.stand-alone-bottom-margin-xxl{margin-bottom:var(--kirby-spacing-xxl)}.stand-alone-bottom-margin-xxxl{margin-bottom:var(--kirby-spacing-xxxl)}\n", ":host{overflow:hidden}:host-context(.has-divider) ion-item-sliding:not(.last){border-bottom:1px solid var(--kirby-list-item-border-color, var(--kirby-background-color))}\n"]
+		}]
+	}],
+	ctorParameters: () => [{ type: i1.PlatformService }],
+	propDecorators: {
+		ionItemSliding: [{
+			type: ViewChild,
+			args: [IonItemSliding]
+		}],
+		item: [{ type: Input }],
+		boundaryClass: [{ type: Input }],
+		swipeActions: [{ type: Input }],
+		itemTemplate: [{ type: Input }],
+		isSelected: [{ type: Input }],
+		isSelectable: [{ type: Input }],
+		getItemColor: [{ type: Input }],
+		itemSelect: [{ type: Output }],
+		swipeActionSelect: [{ type: Output }]
+	}
+});
+var ListSectionHeaderComponent = class ListSectionHeaderComponent {
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListSectionHeaderComponent,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: ListSectionHeaderComponent,
+			isStandalone: true,
+			selector: "kirby-list-section-header",
+			inputs: { title: "title" },
+			ngImport: i0,
+			template: "<div class=\"header\">\n  <span class=\"kirby-text-small\">{{ title }}</span>\n</div>\n",
+			changeDetection: i0.ChangeDetectionStrategy.OnPush
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ListSectionHeaderComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "kirby-list-section-header",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<div class=\"header\">\n  <span class=\"kirby-text-small\">{{ title }}</span>\n</div>\n"
+		}]
+	}],
+	propDecorators: { title: [{ type: Input }] }
+});
+var ListItemTemplateDirective = class ListItemTemplateDirective {
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListItemTemplateDirective,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Directive
+		});
+	}
+	static {
+		this.ɵdir = i0.ɵɵngDeclareDirective({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: ListItemTemplateDirective,
+			isStandalone: true,
+			selector: "[kirbyListItemTemplate]",
+			ngImport: i0
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ListItemTemplateDirective,
+	decorators: [{
+		type: Directive,
+		args: [{ selector: "[kirbyListItemTemplate]" }]
+	}]
+});
+var ListHeaderDirective = class ListHeaderDirective {
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListHeaderDirective,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Directive
+		});
+	}
+	static {
+		this.ɵdir = i0.ɵɵngDeclareDirective({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: ListHeaderDirective,
+			isStandalone: true,
+			selector: "[kirbyListHeader], [kirbyListHeaderTemplate]",
+			ngImport: i0
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ListHeaderDirective,
+	decorators: [{
+		type: Directive,
+		args: [{ selector: "[kirbyListHeader], [kirbyListHeaderTemplate]" }]
+	}]
+});
+var ListSectionHeaderDirective = class ListSectionHeaderDirective {
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListSectionHeaderDirective,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Directive
+		});
+	}
+	static {
+		this.ɵdir = i0.ɵɵngDeclareDirective({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: ListSectionHeaderDirective,
+			isStandalone: true,
+			selector: "[kirbyListSectionHeader], [kirbyListSectionHeaderTemplate]",
+			ngImport: i0
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ListSectionHeaderDirective,
+	decorators: [{
+		type: Directive,
+		args: [{ selector: "[kirbyListSectionHeader], [kirbyListSectionHeaderTemplate]" }]
+	}]
+});
+var ListFooterDirective = class ListFooterDirective {
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListFooterDirective,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Directive
+		});
+	}
+	static {
+		this.ɵdir = i0.ɵɵngDeclareDirective({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: ListFooterDirective,
+			isStandalone: true,
+			selector: "[kirbyListFooter], [kirbyListFooterTemplate]",
+			ngImport: i0
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ListFooterDirective,
+	decorators: [{
+		type: Directive,
+		args: [{ selector: "[kirbyListFooter], [kirbyListFooterTemplate]" }]
+	}]
+});
+var ListComponent = class ListComponent {
+	get isShapeRounded() {
+		return this.shape === "rounded";
+	}
+	get isShapeNone() {
+		return this.shape === "none";
+	}
+	constructor(listHelper, element, renderer) {
+		this.listHelper = listHelper;
+		this.element = element;
+		this.renderer = renderer;
+		this.items = [];
+		this.standAloneSpacing = "xxs";
+		this.showDivider = true;
+		this.markSelectedRow = false;
+		this.shape = "rounded";
+		this.loadOnDemand = new EventEmitter();
+		this.swipeActions = [];
+		this.itemSelect = new EventEmitter();
+		this.disableSelectionHighlight = false;
+		this._attributesToForward = ["aria-label", "aria-labelledby"];
+	}
+	ngOnInit() {
+		this._isSelectable = this.itemSelect.observers.length > 0;
+		if (this.isLoadOnDemandEnabled === void 0) this.isLoadOnDemandEnabled = this.loadOnDemand.observers.length > 0;
+	}
+	ngOnChanges() {
+		this._isSectionsEnabled = !!this.getSectionName;
+		this._isStandAloneEnabled = !!this.getStandAloneByProperty;
+		if (this._isSectionsEnabled && this._isStandAloneEnabled) this._groupedItems = this.listHelper.groupSectionsWithStandAloneItems(this.items, this.getSectionName, this.getStandAloneByProperty);
+		else if (this._isSectionsEnabled) this._groupedItems = this.listHelper.groupSections(this.items, this.getSectionName);
+		else if (this._isStandAloneEnabled) this._groupedItems = this.listHelper.groupStandAloneItems(this.items, this.getStandAloneByProperty);
+	}
+	ngAfterViewInit() {
+		forwardAttributes(this.element.nativeElement, this._attributesToForward, this.renderer, this.element.nativeElement.querySelector("ion-list"));
+	}
+	_onLoadOnDemand() {
+		this.listHelper.onLoadOnDemand(this);
+	}
+	sectionTrackBy(index, section) {
+		return section?.name ?? index;
+	}
+	onItemSelect(item) {
+		if (!this.disableSelectionHighlight) this._selectedItem = item;
+		this.itemSelect.emit(item);
+	}
+	onSwipeActionSelect(args) {
+		args.swipeAction.onSelected(args.item);
+		this.list.closeSlidingItems();
+		args.event.stopPropagation();
+	}
+	_getBoundaryClass(index, section) {
+		if (index === 0) {
+			if (this.headerTemplate) return null;
+			else return section.length === 1 ? ["first", "last"] : "first";
+		}
+		if (index === section.length - 1) return this.footerTemplate ? null : "last";
+		return null;
+	}
+	standAloneClass() {
+		return this._isStandAloneEnabled ? `stand-alone-bottom-margin-${this.standAloneSpacing}` : "";
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListComponent,
+			deps: [
+				{ token: ListHelper },
+				{ token: i0.ElementRef },
+				{ token: i0.Renderer2 }
+			],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "17.0.0",
+			version: "22.2.2",
+			type: ListComponent,
+			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: { properties: {
+				"class.shape-rounded": "this.isShapeRounded",
+				"class.shape-none": "this.isShapeNone",
+				"class.item-spacing": "this.hasItemSpacing",
+				"class.has-sections": "this._isSectionsEnabled",
+				"class.has-stand-alone": "this._isStandAloneEnabled"
+			} },
+			providers: [ListHelper],
+			queries: [
+				{
+					propertyName: "headerTemplate",
+					first: true,
+					predicate: ListHeaderDirective,
+					descendants: true,
+					read: TemplateRef
+				},
+				{
+					propertyName: "sectionHeaderTemplate",
+					first: true,
+					predicate: ListSectionHeaderDirective,
+					descendants: true,
+					read: TemplateRef
+				},
+				{
+					propertyName: "footerTemplate",
+					first: true,
+					predicate: ListFooterDirective,
+					descendants: true,
+					read: TemplateRef
+				},
+				{
+					propertyName: "itemTemplate",
+					first: true,
+					predicate: ListItemTemplateDirective,
+					descendants: true,
+					read: TemplateRef,
+					static: true
+				}
+			],
+			viewQueries: [{
+				propertyName: "list",
+				first: true,
+				predicate: ["list"],
+				descendants: true,
+				static: true
+			}, {
+				propertyName: "scrollDirective",
+				first: true,
+				predicate: InfiniteScrollDirective,
+				descendants: true
+			}],
+			usesOnChanges: true,
+			ngImport: i0,
+			template: "<ion-list\n  #list\n  kirbyInfiniteScroll\n  (scrollEnd)=\"_onLoadOnDemand()\"\n  [disabled]=\"!isLoadOnDemandEnabled\"\n  class=\"list\"\n  [class.has-header]=\"headerTemplate\"\n  [class.has-footer]=\"footerTemplate\"\n  [class.has-divider]=\"showDivider\"\n>\n  @if (headerTemplate) {\n    <ion-list-header>\n      <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n    </ion-list-header>\n  }\n\n  <ng-container\n    *ngTemplateOutlet=\"\n      _isSectionsEnabled || _isStandAloneEnabled ? groupedListTemplate : itemsTemplate;\n      context: { $implicit: items }\n    \"\n  ></ng-container>\n\n  @if (footerTemplate) {\n    <div class=\"footer\">\n      <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n    </div>\n  }\n</ion-list>\n\n@if (!isLoadOnDemandEnabled && noMoreItemsText) {\n  <p class=\"no-more-items\">\n    {{ noMoreItemsText }}\n  </p>\n}\n@if (_isLoading) {\n  <div class=\"loading\">\n    <kirby-spinner></kirby-spinner>\n  </div>\n}\n\n<ng-template #groupedListTemplate>\n  @for (section of _groupedItems; track sectionTrackBy($index, section)) {\n    <ion-item-group [ngClass]=\"standAloneClass()\">\n      @if (_isSectionsEnabled) {\n        <ion-item-divider>\n          <ng-container\n            *ngTemplateOutlet=\"sectionHeaderTemplate; context: { $implicit: section.name }\"\n          ></ng-container>\n        </ion-item-divider>\n      }\n      @if (_isSectionsEnabled && _isStandAloneEnabled) {\n        @for (list of section.lists; track list) {\n          <div class=\"list-items\" [ngClass]=\"standAloneClass()\">\n            <ng-container\n              *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: list }\"\n            ></ng-container>\n          </div>\n        }\n      } @else {\n        <div class=\"list-items\" [ngClass]=\"standAloneClass()\">\n          <ng-container\n            *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: section.items }\"\n          ></ng-container>\n        </div>\n      }\n    </ion-item-group>\n  }\n</ng-template>\n\n<ng-template #itemsTemplate let-items>\n  @for (item of items; track trackBy ? trackBy($index, item) : $index; let i = $index) {\n    <kirby-list-item\n      [item]=\"item\"\n      [itemTemplate]=\"itemTemplate\"\n      [swipeActions]=\"swipeActions\"\n      [boundaryClass]=\"_getBoundaryClass(i, items)\"\n      [isSelectable]=\"_isSelectable\"\n      [getItemColor]=\"getItemColor\"\n      [isSelected]=\"_isSelectable && item === _selectedItem\"\n      (itemSelect)=\"onItemSelect($event)\"\n      (swipeActionSelect)=\"onSwipeActionSelect($event)\"\n      [class.is-single]=\"items.length === 1\"\n    ></kirby-list-item>\n  }\n</ng-template>\n",
+			styles: ["ion-item-option.primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}ion-item-option.secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}ion-item-option.tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}ion-item-option.success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}ion-item-option.warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}ion-item-option.danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}ion-item-option.white-overlay{background-color:var(--kirby-white-overlay);color:var(--kirby-white-overlay-contrast)}ion-item-option.light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}ion-item-option.medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}ion-item-option.dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}ion-item-option.dark-overlay{background-color:var(--kirby-dark-overlay);color:var(--kirby-dark-overlay-contrast)}:host{display:block}:host(:not(kirby-list-item)){--kirby-list-border-top-radius: var( --kirby-content-border-top-radius, var(--kirby-border-radius-n) );--kirby-list-border-bottom-radius: var( --kirby-content-border-bottom-radius, var(--kirby-border-radius-n) )}.list{box-shadow:var(--kirby-elevation-2);background:transparent;contain:inherit;padding:0}ion-list-header{background-color:var(--kirby-white);border-bottom:1px solid var(--kirby-background-color);padding:0;text-transform:inherit;letter-spacing:inherit;font-weight:inherit;font-size:inherit;min-height:0;overflow:inherit}ion-item{--background: var(--kirby-white);--background-activated: var(--kirby-white-shade);--background-hover: var(--kirby-background-color);--background-focused: var(--kirby-background-color);--inner-border-width: 0;--ion-safe-area-right: 0;--min-height: var(--kirby-spacing-xxxl);--padding-bottom: var(--kirby-spacing-xxs);--padding-end: var(--kirby-spacing-s);--padding-start: var(--kirby-spacing-s);--padding-top: var(--kirby-spacing-xxs);display:flex;font-size:var(--kirby-font-size-s);min-height:var(--kirby-spacing-xxxl);overflow:visible;width:100%}ion-item-sliding{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color)}ion-item-sliding.item-sliding-active-slide{backface-visibility:hidden;transform:translateZ(0)}ion-item-sliding.light{--kirby-inputs-background-color: var(--kirby-white);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-divider-color: var(--kirby-medium);--kirby-inputs-elevation: var(--kirby-elevation-2);--kirby-item-background: var(--kirby-light);--kirby-item-background-activated: var(--kirby-light-shade);--kirby-item-background-focused: var(--kirby-light-shade);--kirby-item-background-hover: var(--kirby-light-tint)}ion-item-sliding.light ion-item{--background: var(--kirby-light);--color: var(--kirby-light-contrast);--background-activated: var(--kirby-light-shade);--background-focused: var(--kirby-light-shade);--background-hover: var(--kirby-light-tint)}ion-item-group{margin-bottom:var(--kirby-spacing-m)}ion-item-group:last-of-type{margin-bottom:0}ion-item-divider{--inner-padding-end: 0;--color: unset;background-color:transparent;border-color:transparent;min-height:0;padding:0 var(--kirby-spacing-s) var(--kirby-spacing-xxs) var(--kirby-spacing-s);font-weight:inherit}.footer{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color);background-color:var(--kirby-white);border-top:1px solid var(--kirby-background-color);display:flex;align-items:center;justify-content:space-between;width:100%}.no-more-items,.loading{width:100%;padding:var(--kirby-spacing-m) 0;text-align:center}.swipe-action{display:flex;color:var(--kirby-black);background-color:transparent}.swipe-action ion-item-option{height:100%;display:inline-block;text-align:center}.swipe-action .item-content{display:inline-grid;min-width:70px;flex-direction:column}.swipe-action .item-content ion-label{--background: unset;--color: unset}ion-item-options[side=end]{border-bottom-width:0}:host-context(.has-sections) .list,:host-context(.has-stand-alone) .list{box-shadow:none}:host-context(.has-sections) .list-items,:host-context(.has-stand-alone) .list-items{box-shadow:var(--kirby-elevation-2);border-radius:var(--kirby-border-radius-n)}:host-context(.has-sections) .footer,:host-context(.has-stand-alone) .footer{background-color:transparent;border-top:none}:host-context(.has-sections) ion-list-header,:host-context(.has-stand-alone) ion-list-header{background-color:transparent;border-bottom:none}:host-context(.shape-rounded) .list,:host-context(.shape-rounded) .list-items{border-radius:var(--kirby-list-border-top-radius) var(--kirby-list-border-top-radius) var(--kirby-list-border-bottom-radius) var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item.first,:host-context(.shape-rounded) ion-item-sliding.first,:host-context(.shape-rounded) ion-list-header{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) ion-list-header{border-top-left-radius:var(--kirby-list-border-top-radius);border-top-right-radius:var(--kirby-list-border-top-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item-sliding{border-top-left-radius:0;border-top-right-radius:0}:host-context(.shape-rounded) ion-item.last,:host-context(.shape-rounded) ion-item-sliding.last,:host-context(.shape-rounded) .footer{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) .footer{border-bottom-left-radius:var(--kirby-list-border-bottom-radius);border-bottom-right-radius:var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item-sliding{border-bottom-left-radius:0;border-bottom-right-radius:0}kirby-list-item{--kirby-content-border-top-radius: 0;--kirby-content-border-bottom-radius: 0}kirby-list-item:first-of-type{--kirby-content-border-top-radius: var(--kirby-list-border-top-radius)}kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: var(--kirby-list-border-bottom-radius)}.has-header kirby-list-item:first-of-type{--kirby-content-border-top-radius: 0}.has-footer kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: 0}:host-context(.shape-none) .list,:host-context(.shape-none) .list-items{box-shadow:none;border-radius:unset;--kirby-item-background: transparent;--kirby-list-item-border-color: var(--kirby-medium)}:host-context(kirby-card){--kirby-list-item-border-color: var(--kirby-background-color)}:host-context(kirby-card.outlined){--kirby-list-item-border-color: var(--kirby-medium)}:host-context(.item-spacing) .list kirby-list-item{margin-bottom:var(--kirby-spacing-s)}:host-context(.item-spacing) .list kirby-list-item>ion-item,:host-context(.item-spacing) .list kirby-list-item:last-child{margin-bottom:0}.stand-alone-bottom-margin-xxxxs{margin-bottom:var(--kirby-spacing-xxxxs)}.stand-alone-bottom-margin-xxxs{margin-bottom:var(--kirby-spacing-xxxs)}.stand-alone-bottom-margin-xxs{margin-bottom:var(--kirby-spacing-xxs)}.stand-alone-bottom-margin-xs{margin-bottom:var(--kirby-spacing-xs)}.stand-alone-bottom-margin-sm{margin-bottom:var(--kirby-spacing-s)}.stand-alone-bottom-margin-md{margin-bottom:var(--kirby-spacing-m)}.stand-alone-bottom-margin-lg{margin-bottom:var(--kirby-spacing-l)}.stand-alone-bottom-margin-xl{margin-bottom:var(--kirby-spacing-xl)}.stand-alone-bottom-margin-xxl{margin-bottom:var(--kirby-spacing-xxl)}.stand-alone-bottom-margin-xxxl{margin-bottom:var(--kirby-spacing-xxxl)}\n"],
+			dependencies: [
+				{
+					kind: "component",
+					type: IonList,
+					selector: "ion-list",
+					inputs: [
+						"inset",
+						"lines",
+						"mode"
+					]
+				},
+				{
+					kind: "directive",
+					type: InfiniteScrollDirective,
+					selector: "[kirbyInfiniteScroll]",
+					inputs: ["disabled"],
+					outputs: ["scrollEnd"]
+				},
+				{
+					kind: "component",
+					type: IonListHeader,
+					selector: "ion-list-header",
+					inputs: [
+						"color",
+						"lines",
+						"mode"
+					]
+				},
+				{
+					kind: "directive",
+					type: NgTemplateOutlet,
+					selector: "[ngTemplateOutlet]",
+					inputs: [
+						"ngTemplateOutletContext",
+						"ngTemplateOutlet",
+						"ngTemplateOutletInjector"
+					]
+				},
+				{
+					kind: "component",
+					type: SpinnerComponent,
+					selector: "kirby-spinner"
+				},
+				{
+					kind: "component",
+					type: IonItemGroup,
+					selector: "ion-item-group"
+				},
+				{
+					kind: "directive",
+					type: NgClass,
+					selector: "[ngClass]",
+					inputs: ["class", "ngClass"]
+				},
+				{
+					kind: "component",
+					type: IonItemDivider,
+					selector: "ion-item-divider",
+					inputs: [
+						"color",
+						"mode",
+						"sticky"
+					]
+				},
+				{
+					kind: "component",
+					type: ListItemComponent,
+					selector: "kirby-list-item",
+					inputs: [
+						"item",
+						"boundaryClass",
+						"swipeActions",
+						"itemTemplate",
+						"isSelected",
+						"isSelectable",
+						"getItemColor"
+					],
+					outputs: ["itemSelect", "swipeActionSelect"]
+				}
+			],
+			changeDetection: i0.ChangeDetectionStrategy.Eager
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ListComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "kirby-list",
+			providers: [ListHelper],
+			imports: [
+				IonList,
+				InfiniteScrollDirective,
+				IonListHeader,
+				NgTemplateOutlet,
+				SpinnerComponent,
+				IonItemGroup,
+				NgClass,
+				IonItemDivider,
+				ListItemComponent
+			],
+			changeDetection: ChangeDetectionStrategy.Eager,
+			template: "<ion-list\n  #list\n  kirbyInfiniteScroll\n  (scrollEnd)=\"_onLoadOnDemand()\"\n  [disabled]=\"!isLoadOnDemandEnabled\"\n  class=\"list\"\n  [class.has-header]=\"headerTemplate\"\n  [class.has-footer]=\"footerTemplate\"\n  [class.has-divider]=\"showDivider\"\n>\n  @if (headerTemplate) {\n    <ion-list-header>\n      <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n    </ion-list-header>\n  }\n\n  <ng-container\n    *ngTemplateOutlet=\"\n      _isSectionsEnabled || _isStandAloneEnabled ? groupedListTemplate : itemsTemplate;\n      context: { $implicit: items }\n    \"\n  ></ng-container>\n\n  @if (footerTemplate) {\n    <div class=\"footer\">\n      <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n    </div>\n  }\n</ion-list>\n\n@if (!isLoadOnDemandEnabled && noMoreItemsText) {\n  <p class=\"no-more-items\">\n    {{ noMoreItemsText }}\n  </p>\n}\n@if (_isLoading) {\n  <div class=\"loading\">\n    <kirby-spinner></kirby-spinner>\n  </div>\n}\n\n<ng-template #groupedListTemplate>\n  @for (section of _groupedItems; track sectionTrackBy($index, section)) {\n    <ion-item-group [ngClass]=\"standAloneClass()\">\n      @if (_isSectionsEnabled) {\n        <ion-item-divider>\n          <ng-container\n            *ngTemplateOutlet=\"sectionHeaderTemplate; context: { $implicit: section.name }\"\n          ></ng-container>\n        </ion-item-divider>\n      }\n      @if (_isSectionsEnabled && _isStandAloneEnabled) {\n        @for (list of section.lists; track list) {\n          <div class=\"list-items\" [ngClass]=\"standAloneClass()\">\n            <ng-container\n              *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: list }\"\n            ></ng-container>\n          </div>\n        }\n      } @else {\n        <div class=\"list-items\" [ngClass]=\"standAloneClass()\">\n          <ng-container\n            *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: section.items }\"\n          ></ng-container>\n        </div>\n      }\n    </ion-item-group>\n  }\n</ng-template>\n\n<ng-template #itemsTemplate let-items>\n  @for (item of items; track trackBy ? trackBy($index, item) : $index; let i = $index) {\n    <kirby-list-item\n      [item]=\"item\"\n      [itemTemplate]=\"itemTemplate\"\n      [swipeActions]=\"swipeActions\"\n      [boundaryClass]=\"_getBoundaryClass(i, items)\"\n      [isSelectable]=\"_isSelectable\"\n      [getItemColor]=\"getItemColor\"\n      [isSelected]=\"_isSelectable && item === _selectedItem\"\n      (itemSelect)=\"onItemSelect($event)\"\n      (swipeActionSelect)=\"onSwipeActionSelect($event)\"\n      [class.is-single]=\"items.length === 1\"\n    ></kirby-list-item>\n  }\n</ng-template>\n",
+			styles: ["ion-item-option.primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}ion-item-option.secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}ion-item-option.tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}ion-item-option.success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}ion-item-option.warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}ion-item-option.danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}ion-item-option.white-overlay{background-color:var(--kirby-white-overlay);color:var(--kirby-white-overlay-contrast)}ion-item-option.light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}ion-item-option.medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}ion-item-option.dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}ion-item-option.dark-overlay{background-color:var(--kirby-dark-overlay);color:var(--kirby-dark-overlay-contrast)}:host{display:block}:host(:not(kirby-list-item)){--kirby-list-border-top-radius: var( --kirby-content-border-top-radius, var(--kirby-border-radius-n) );--kirby-list-border-bottom-radius: var( --kirby-content-border-bottom-radius, var(--kirby-border-radius-n) )}.list{box-shadow:var(--kirby-elevation-2);background:transparent;contain:inherit;padding:0}ion-list-header{background-color:var(--kirby-white);border-bottom:1px solid var(--kirby-background-color);padding:0;text-transform:inherit;letter-spacing:inherit;font-weight:inherit;font-size:inherit;min-height:0;overflow:inherit}ion-item{--background: var(--kirby-white);--background-activated: var(--kirby-white-shade);--background-hover: var(--kirby-background-color);--background-focused: var(--kirby-background-color);--inner-border-width: 0;--ion-safe-area-right: 0;--min-height: var(--kirby-spacing-xxxl);--padding-bottom: var(--kirby-spacing-xxs);--padding-end: var(--kirby-spacing-s);--padding-start: var(--kirby-spacing-s);--padding-top: var(--kirby-spacing-xxs);display:flex;font-size:var(--kirby-font-size-s);min-height:var(--kirby-spacing-xxxl);overflow:visible;width:100%}ion-item-sliding{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color)}ion-item-sliding.item-sliding-active-slide{backface-visibility:hidden;transform:translateZ(0)}ion-item-sliding.light{--kirby-inputs-background-color: var(--kirby-white);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-divider-color: var(--kirby-medium);--kirby-inputs-elevation: var(--kirby-elevation-2);--kirby-item-background: var(--kirby-light);--kirby-item-background-activated: var(--kirby-light-shade);--kirby-item-background-focused: var(--kirby-light-shade);--kirby-item-background-hover: var(--kirby-light-tint)}ion-item-sliding.light ion-item{--background: var(--kirby-light);--color: var(--kirby-light-contrast);--background-activated: var(--kirby-light-shade);--background-focused: var(--kirby-light-shade);--background-hover: var(--kirby-light-tint)}ion-item-group{margin-bottom:var(--kirby-spacing-m)}ion-item-group:last-of-type{margin-bottom:0}ion-item-divider{--inner-padding-end: 0;--color: unset;background-color:transparent;border-color:transparent;min-height:0;padding:0 var(--kirby-spacing-s) var(--kirby-spacing-xxs) var(--kirby-spacing-s);font-weight:inherit}.footer{--kirby-inputs-background-color: var(--kirby-dark-overlay);--kirby-inputs-background-color-hover: var(--kirby-dark-overlay-10);--kirby-inputs-background-color-active: var(--kirby-dark-overlay-20);--kirby-inputs-color: var(--kirby-black);--kirby-inputs-indicator-background-color: var(--kirby-black);--kirby-inputs-indicator-color: var(--kirby-white);--kirby-inputs-placeholder-color: var(--kirby-semi-dark);--kirby-inputs-color-hover: var(--kirby-semi-dark);--kirby-inputs-elevation: none;--kirby-divider-color: var(--kirby-background-color);background-color:var(--kirby-white);border-top:1px solid var(--kirby-background-color);display:flex;align-items:center;justify-content:space-between;width:100%}.no-more-items,.loading{width:100%;padding:var(--kirby-spacing-m) 0;text-align:center}.swipe-action{display:flex;color:var(--kirby-black);background-color:transparent}.swipe-action ion-item-option{height:100%;display:inline-block;text-align:center}.swipe-action .item-content{display:inline-grid;min-width:70px;flex-direction:column}.swipe-action .item-content ion-label{--background: unset;--color: unset}ion-item-options[side=end]{border-bottom-width:0}:host-context(.has-sections) .list,:host-context(.has-stand-alone) .list{box-shadow:none}:host-context(.has-sections) .list-items,:host-context(.has-stand-alone) .list-items{box-shadow:var(--kirby-elevation-2);border-radius:var(--kirby-border-radius-n)}:host-context(.has-sections) .footer,:host-context(.has-stand-alone) .footer{background-color:transparent;border-top:none}:host-context(.has-sections) ion-list-header,:host-context(.has-stand-alone) ion-list-header{background-color:transparent;border-bottom:none}:host-context(.shape-rounded) .list,:host-context(.shape-rounded) .list-items{border-radius:var(--kirby-list-border-top-radius) var(--kirby-list-border-top-radius) var(--kirby-list-border-bottom-radius) var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item.first,:host-context(.shape-rounded) ion-item-sliding.first,:host-context(.shape-rounded) ion-list-header{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) ion-list-header{border-top-left-radius:var(--kirby-list-border-top-radius);border-top-right-radius:var(--kirby-list-border-top-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item-sliding{border-top-left-radius:0;border-top-right-radius:0}:host-context(.shape-rounded) ion-item.last,:host-context(.shape-rounded) ion-item-sliding.last,:host-context(.shape-rounded) .footer{-webkit-mask-image:radial-gradient(#fff,#000);mask-image:radial-gradient(#fff,#000)}:host-context(.shape-rounded) .footer{border-bottom-left-radius:var(--kirby-list-border-bottom-radius);border-bottom-right-radius:var(--kirby-list-border-bottom-radius)}:host-context(.shape-rounded) ion-item-sliding>ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item-sliding{border-bottom-left-radius:0;border-bottom-right-radius:0}kirby-list-item{--kirby-content-border-top-radius: 0;--kirby-content-border-bottom-radius: 0}kirby-list-item:first-of-type{--kirby-content-border-top-radius: var(--kirby-list-border-top-radius)}kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: var(--kirby-list-border-bottom-radius)}.has-header kirby-list-item:first-of-type{--kirby-content-border-top-radius: 0}.has-footer kirby-list-item:last-of-type{--kirby-content-border-bottom-radius: 0}:host-context(.shape-none) .list,:host-context(.shape-none) .list-items{box-shadow:none;border-radius:unset;--kirby-item-background: transparent;--kirby-list-item-border-color: var(--kirby-medium)}:host-context(kirby-card){--kirby-list-item-border-color: var(--kirby-background-color)}:host-context(kirby-card.outlined){--kirby-list-item-border-color: var(--kirby-medium)}:host-context(.item-spacing) .list kirby-list-item{margin-bottom:var(--kirby-spacing-s)}:host-context(.item-spacing) .list kirby-list-item>ion-item,:host-context(.item-spacing) .list kirby-list-item:last-child{margin-bottom:0}.stand-alone-bottom-margin-xxxxs{margin-bottom:var(--kirby-spacing-xxxxs)}.stand-alone-bottom-margin-xxxs{margin-bottom:var(--kirby-spacing-xxxs)}.stand-alone-bottom-margin-xxs{margin-bottom:var(--kirby-spacing-xxs)}.stand-alone-bottom-margin-xs{margin-bottom:var(--kirby-spacing-xs)}.stand-alone-bottom-margin-sm{margin-bottom:var(--kirby-spacing-s)}.stand-alone-bottom-margin-md{margin-bottom:var(--kirby-spacing-m)}.stand-alone-bottom-margin-lg{margin-bottom:var(--kirby-spacing-l)}.stand-alone-bottom-margin-xl{margin-bottom:var(--kirby-spacing-xl)}.stand-alone-bottom-margin-xxl{margin-bottom:var(--kirby-spacing-xxl)}.stand-alone-bottom-margin-xxxl{margin-bottom:var(--kirby-spacing-xxxl)}\n"]
+		}]
+	}],
+	ctorParameters: () => [
+		{ type: ListHelper },
+		{ type: i0.ElementRef },
+		{ type: i0.Renderer2 }
+	],
+	propDecorators: {
+		list: [{
+			type: ViewChild,
+			args: ["list", { static: true }]
+		}],
+		scrollDirective: [{
+			type: ViewChild,
+			args: [InfiniteScrollDirective]
+		}],
+		items: [{ type: Input }],
+		getItemColor: [{ type: Input }],
+		getSectionName: [{ type: Input }],
+		trackBy: [{ type: Input }],
+		getStandAloneByProperty: [{ type: Input }],
+		standAloneSpacing: [{ type: Input }],
+		noMoreItemsText: [{ type: Input }],
+		showDivider: [{ type: Input }],
+		markSelectedRow: [{ type: Input }],
+		shape: [{ type: Input }],
+		isShapeRounded: [{
+			type: HostBinding,
+			args: ["class.shape-rounded"]
+		}],
+		isShapeNone: [{
+			type: HostBinding,
+			args: ["class.shape-none"]
+		}],
+		hasItemSpacing: [{
+			type: HostBinding,
+			args: ["class.item-spacing"]
+		}, { type: Input }],
+		isLoadOnDemandEnabled: [{ type: Input }],
+		loadOnDemand: [{ type: Output }],
+		swipeActions: [{ type: Input }],
+		itemSelect: [{ type: Output }],
+		disableSelectionHighlight: [{ type: Input }],
+		headerTemplate: [{
+			type: ContentChild,
+			args: [ListHeaderDirective, {
+				static: false,
+				read: TemplateRef
+			}]
+		}],
+		sectionHeaderTemplate: [{
+			type: ContentChild,
+			args: [ListSectionHeaderDirective, {
+				static: false,
+				read: TemplateRef
+			}]
+		}],
+		footerTemplate: [{
+			type: ContentChild,
+			args: [ListFooterDirective, {
+				static: false,
+				read: TemplateRef
+			}]
+		}],
+		itemTemplate: [{
+			type: ContentChild,
+			args: [ListItemTemplateDirective, {
+				static: true,
+				read: TemplateRef
+			}]
+		}],
+		_isSectionsEnabled: [{
+			type: HostBinding,
+			args: ["class.has-sections"]
+		}],
+		_isStandAloneEnabled: [{
+			type: HostBinding,
+			args: ["class.has-stand-alone"]
+		}]
+	}
+});
 const reexportedImports = [
-    ListComponent,
-    ListItemComponent,
-    ListItemTemplateDirective,
-    ListSectionHeaderComponent,
-    ListSectionHeaderDirective,
-    ListHeaderDirective,
-    ListHeaderComponent,
-    ListFooterDirective,
-    ListExperimentalComponent,
+	ListComponent,
+	ListItemComponent,
+	ListItemTemplateDirective,
+	ListSectionHeaderComponent,
+	ListSectionHeaderDirective,
+	ListHeaderDirective,
+	ListHeaderComponent,
+	ListFooterDirective,
+	ListExperimentalComponent
 ];
 const imports = [
-    ...reexportedImports,
-    ListItemColorDirective,
-    InfiniteScrollDirective,
-    ListItemComponent,
+	...reexportedImports,
+	ListItemColorDirective,
+	InfiniteScrollDirective,
+	ListItemComponent
 ];
-class ListModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.18", ngImport: i0, type: ListModule, imports: [CommonModule,
-            IconModule,
-            SpinnerModule,
-            IonItemDivider,
-            IonItemGroup,
-            IonItemOptions,
-            IonItemSliding,
-            IonLabel,
-            IonList,
-            IonListHeader, ListComponent,
-            ListItemComponent,
-            ListItemTemplateDirective,
-            ListSectionHeaderComponent,
-            ListSectionHeaderDirective,
-            ListHeaderDirective,
-            ListHeaderComponent,
-            ListFooterDirective,
-            ListExperimentalComponent, ListItemColorDirective,
-            InfiniteScrollDirective,
-            ListItemComponent], exports: [ListComponent,
-            ListItemComponent,
-            ListItemTemplateDirective,
-            ListSectionHeaderComponent,
-            ListSectionHeaderDirective,
-            ListHeaderDirective,
-            ListHeaderComponent,
-            ListFooterDirective,
-            ListExperimentalComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListModule, imports: [CommonModule,
-            IconModule,
-            SpinnerModule,
-            IonItemDivider,
-            IonItemGroup,
-            IonItemOptions,
-            IonItemSliding,
-            IonLabel,
-            IonList,
-            IonListHeader, ListComponent,
-            ListItemComponent, ListItemComponent] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ListModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        IconModule,
-                        SpinnerModule,
-                        IonItemDivider,
-                        IonItemGroup,
-                        IonItemOptions,
-                        IonItemSliding,
-                        IonLabel,
-                        IonList,
-                        IonListHeader,
-                        ...imports,
-                    ],
-                    exports: reexportedImports,
-                    providers: [],
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+var ListModule = class ListModule {
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListModule,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.NgModule
+		});
+	}
+	static {
+		this.ɵmod = i0.ɵɵngDeclareNgModule({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListModule,
+			imports: [
+				CommonModule,
+				IconModule,
+				SpinnerModule,
+				IonItemDivider,
+				IonItemGroup,
+				IonItemOptions,
+				IonItemSliding,
+				IonLabel,
+				IonList,
+				IonListHeader,
+				ListComponent,
+				ListItemComponent,
+				ListItemTemplateDirective,
+				ListSectionHeaderComponent,
+				ListSectionHeaderDirective,
+				ListHeaderDirective,
+				ListHeaderComponent,
+				ListFooterDirective,
+				ListExperimentalComponent,
+				ListItemColorDirective,
+				InfiniteScrollDirective,
+				ListItemComponent
+			],
+			exports: [
+				ListComponent,
+				ListItemComponent,
+				ListItemTemplateDirective,
+				ListSectionHeaderComponent,
+				ListSectionHeaderDirective,
+				ListHeaderDirective,
+				ListHeaderComponent,
+				ListFooterDirective,
+				ListExperimentalComponent
+			]
+		});
+	}
+	static {
+		this.ɵinj = i0.ɵɵngDeclareInjector({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: ListModule,
+			imports: [
+				CommonModule,
+				IconModule,
+				SpinnerModule,
+				IonItemDivider,
+				IonItemGroup,
+				IonItemOptions,
+				IonItemSliding,
+				IonLabel,
+				IonList,
+				IonListHeader,
+				ListComponent,
+				ListItemComponent,
+				ListItemComponent
+			]
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: ListModule,
+	decorators: [{
+		type: NgModule,
+		args: [{
+			imports: [
+				CommonModule,
+				IconModule,
+				SpinnerModule,
+				IonItemDivider,
+				IonItemGroup,
+				IonItemOptions,
+				IonItemSliding,
+				IonLabel,
+				IonList,
+				IonListHeader,
+				...imports
+			],
+			exports: reexportedImports,
+			providers: []
+		}]
+	}]
+});
 export { INFINITE_SCROLL_DEBOUNCE, InfiniteScrollDirective, ListComponent, ListExperimentalComponent, ListFooterDirective, ListHeaderComponent, ListHeaderDirective, ListHelper, ListItemColorDirective, ListItemComponent, ListItemTemplateDirective, ListModule, ListSectionHeaderComponent, ListSectionHeaderDirective };
-//# sourceMappingURL=kirbydesign-designsystem-list.mjs.map
+
+//# sourceMappingURL=kirbydesign-designsystem-list.mjs.map