@kirbydesign/designsystem 4.0.18 → 4.0.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. package/bundles/kirbydesign-designsystem-testing-base.umd.js +57 -39
  2. package/bundles/kirbydesign-designsystem-testing-base.umd.js.map +1 -1
  3. package/bundles/kirbydesign-designsystem-testing-base.umd.min.js +1 -1
  4. package/bundles/kirbydesign-designsystem-testing-base.umd.min.js.map +1 -1
  5. package/bundles/kirbydesign-designsystem.umd.js +119 -165
  6. package/bundles/kirbydesign-designsystem.umd.js.map +1 -1
  7. package/bundles/kirbydesign-designsystem.umd.min.js +1 -1
  8. package/bundles/kirbydesign-designsystem.umd.min.js.map +1 -1
  9. package/esm2015/kirbydesign-designsystem.js +64 -63
  10. package/esm2015/kirbydesign-designsystem.metadata.json +1 -1
  11. package/esm2015/lib/components/list/index.js +2 -1
  12. package/esm2015/lib/components/list/index.metadata.json +1 -1
  13. package/esm2015/lib/components/list/list-experimental/list-experimental.component.js +10 -0
  14. package/esm2015/lib/components/list/list-experimental/list-experimental.component.metadata.json +1 -0
  15. package/esm2015/lib/components/list/list-item/list-item.component.js +1 -1
  16. package/esm2015/lib/components/list/list-item/list-item.component.metadata.json +1 -1
  17. package/esm2015/lib/components/list/list.component.js +29 -72
  18. package/esm2015/lib/components/list/list.component.metadata.json +1 -1
  19. package/esm2015/lib/components/list/list.module.js +4 -3
  20. package/esm2015/lib/components/list/list.module.metadata.json +1 -1
  21. package/esm2015/lib/kirby.module.js +1 -3
  22. package/esm2015/lib/kirby.module.metadata.json +1 -1
  23. package/esm2015/testing-base/kirbydesign-designsystem-testing-base.js +29 -28
  24. package/esm2015/testing-base/kirbydesign-designsystem-testing-base.metadata.json +1 -1
  25. package/esm2015/testing-base/lib/components/mock.list-experimental.component.js +19 -0
  26. package/esm2015/testing-base/lib/components/mock.list-experimental.component.metadata.json +1 -0
  27. package/esm2015/testing-base/lib/components/mock.list.component.js +1 -5
  28. package/esm2015/testing-base/lib/components/mock.list.component.metadata.json +1 -1
  29. package/esm2015/testing-base/lib/mock-components.js +3 -1
  30. package/esm2015/testing-base/lib/mock-components.metadata.json +1 -1
  31. package/fesm2015/kirbydesign-designsystem-testing-base.js +20 -6
  32. package/fesm2015/kirbydesign-designsystem-testing-base.js.map +1 -1
  33. package/fesm2015/kirbydesign-designsystem.js +43 -78
  34. package/fesm2015/kirbydesign-designsystem.js.map +1 -1
  35. package/kirbydesign-designsystem.d.ts +63 -62
  36. package/kirbydesign-designsystem.metadata.json +1 -1
  37. package/lib/components/list/index.d.ts +1 -1
  38. package/lib/components/list/list-experimental/list-experimental.component.d.ts +2 -0
  39. package/lib/components/list/list.component.d.ts +34 -10
  40. package/package.json +1 -2
  41. package/testing-base/kirbydesign-designsystem-testing-base.d.ts +28 -27
  42. package/testing-base/kirbydesign-designsystem-testing-base.metadata.json +1 -1
  43. package/testing-base/lib/components/mock.list-experimental.component.d.ts +2 -0
  44. package/testing-base/lib/components/mock.list.component.d.ts +1 -5
  45. package/esm2015/lib/components/list/list-virtual-scroll-settings.type.js +0 -2
  46. package/esm2015/lib/components/list/list-virtual-scroll-settings.type.metadata.json +0 -1
  47. package/lib/components/list/list-virtual-scroll-settings.type.d.ts +0 -2
@@ -1,8 +1,8 @@
1
1
  (function (global, factory) {
2
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@kirbydesign/core'), require('@angular/core'), require('@ionic/angular'), require('@angular/router'), require('rxjs'), require('rxjs/operators'), require('@angular/common'), require('highcharts'), require('chart.js'), require('chartjs-plugin-annotation'), require('highcharts/highstock'), require('highcharts/modules/annotations'), require('date-fns'), require('date-fns-tz'), require('date-fns/locale'), require('@angular/forms'), require('inputmask/lib/extensions/inputmask.date.extensions'), require('inputmask/lib/inputmask'), require('inputmask/lib/extensions/inputmask.numeric.extensions'), require('@angular/animations'), require('ngx-ui-scroll'), require('@kirbydesign/core/loader')) :
3
- typeof define === 'function' && define.amd ? define('@kirbydesign/designsystem', ['exports', '@kirbydesign/core', '@angular/core', '@ionic/angular', '@angular/router', 'rxjs', 'rxjs/operators', '@angular/common', 'highcharts', 'chart.js', 'chartjs-plugin-annotation', 'highcharts/highstock', 'highcharts/modules/annotations', 'date-fns', 'date-fns-tz', 'date-fns/locale', '@angular/forms', 'inputmask/lib/extensions/inputmask.date.extensions', 'inputmask/lib/inputmask', 'inputmask/lib/extensions/inputmask.numeric.extensions', '@angular/animations', 'ngx-ui-scroll', '@kirbydesign/core/loader'], factory) :
4
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.kirbydesign = global.kirbydesign || {}, global.kirbydesign.designsystem = {}), global.core, global.ng.core, global.ionic, global.ng.router, global.rxjs, global.rxjs.operators, global.ng.common, global.highcharts, global.chart_js, global.annotationPlugin, global['highcharts/highstock'], global.highcharts, global['date-fns'], global['date-fns-tz'], global.locale, global.ng.forms, null, global.inputmask, null, global.ng.animations, global['ngx-ui-scroll'], global.loader));
5
- }(this, (function (exports, core, i0, i1, i1$1, rxjs, operators, common, Highcharts, chart_js, annotationPlugin, Highcharts$1, AnnotationsModule, dateFns, dateFnsTz, locale, forms, inputmask_date_extensions, Inputmask, inputmask_numeric_extensions, animations, ngxUiScroll, loader) { 'use strict';
2
+ typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@kirbydesign/core'), require('@angular/core'), require('@ionic/angular'), require('@angular/router'), require('rxjs'), require('rxjs/operators'), require('@angular/common'), require('highcharts'), require('chart.js'), require('chartjs-plugin-annotation'), require('highcharts/highstock'), require('highcharts/modules/annotations'), require('date-fns'), require('date-fns-tz'), require('date-fns/locale'), require('@angular/forms'), require('inputmask/lib/extensions/inputmask.date.extensions'), require('inputmask/lib/inputmask'), require('inputmask/lib/extensions/inputmask.numeric.extensions'), require('@angular/animations'), require('@kirbydesign/core/loader')) :
3
+ typeof define === 'function' && define.amd ? define('@kirbydesign/designsystem', ['exports', '@kirbydesign/core', '@angular/core', '@ionic/angular', '@angular/router', 'rxjs', 'rxjs/operators', '@angular/common', 'highcharts', 'chart.js', 'chartjs-plugin-annotation', 'highcharts/highstock', 'highcharts/modules/annotations', 'date-fns', 'date-fns-tz', 'date-fns/locale', '@angular/forms', 'inputmask/lib/extensions/inputmask.date.extensions', 'inputmask/lib/inputmask', 'inputmask/lib/extensions/inputmask.numeric.extensions', '@angular/animations', '@kirbydesign/core/loader'], factory) :
4
+ (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.kirbydesign = global.kirbydesign || {}, global.kirbydesign.designsystem = {}), global.core, global.ng.core, global.ionic, global.ng.router, global.rxjs, global.rxjs.operators, global.ng.common, global.highcharts, global.chart_js, global.annotationPlugin, global['highcharts/highstock'], global.highcharts, global['date-fns'], global['date-fns-tz'], global.locale, global.ng.forms, null, global.inputmask, null, global.ng.animations, global.loader));
5
+ }(this, (function (exports, core, i0, i1, i1$1, rxjs, operators, common, Highcharts, chart_js, annotationPlugin, Highcharts$1, AnnotationsModule, dateFns, dateFnsTz, locale, forms, inputmask_date_extensions, Inputmask, inputmask_numeric_extensions, animations, loader) { 'use strict';
6
6
 
7
7
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
8
 
@@ -7497,33 +7497,21 @@
7497
7497
  },] }
7498
7498
  ];
7499
7499
 
7500
- var __awaiter$9 = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
7501
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
7502
- return new (P || (P = Promise))(function (resolve, reject) {
7503
- function fulfilled(value) { try {
7504
- step(generator.next(value));
7505
- }
7506
- catch (e) {
7507
- reject(e);
7508
- } }
7509
- function rejected(value) { try {
7510
- step(generator["throw"](value));
7511
- }
7512
- catch (e) {
7513
- reject(e);
7514
- } }
7515
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7516
- step((generator = generator.apply(thisArg, _arguments || [])).next());
7517
- });
7518
- };
7519
- var INTERVAL = 400;
7520
7500
  var ListComponent = /** @class */ (function () {
7521
7501
  function ListComponent(listHelper, groupBy) {
7522
- var _this = this;
7523
7502
  this.listHelper = listHelper;
7524
7503
  this.groupBy = groupBy;
7504
+ /**
7505
+ * Provide items for the list to render. Items must be provided in the order you expect them to be rendered.
7506
+ */
7525
7507
  this.items = [];
7508
+ /**
7509
+ * Determines if dividers (bottom-border on list items) should be shown or not.
7510
+ */
7526
7511
  this.showDivider = false;
7512
+ /**
7513
+ * Determines if list row text should turn bold on selection
7514
+ */
7527
7515
  this.markSelectedRow = false;
7528
7516
  /**
7529
7517
  * Determine outline shape of:
@@ -7533,17 +7521,21 @@
7533
7521
  * `square` means **without** rounded corners, `rounded` means **with** rounded corners., `none` means **without** padding, border, box-shadow and background.
7534
7522
  */
7535
7523
  this.shape = 'rounded';
7536
- this.useVirtualScroll = false;
7537
- this.virtualScrollViewportHeight = 500;
7538
- this.virtualScrollSettings = {};
7539
- this.virtualScrollTimeout = 5000;
7540
- this._virtualScrollData = {
7541
- get: function (index, count) { return _this.getVirtualDataset(index, count); },
7542
- settings: Object.assign({ minIndex: this.virtualScrollSettings.minIndex || 0, startIndex: this.virtualScrollSettings.startIndex || 0, bufferSize: this.virtualScrollSettings.bufferSize || 10 }, this.virtualScrollSettings),
7543
- };
7524
+ /**
7525
+ * Emitting event when more items are to be loaded.
7526
+ */
7544
7527
  this.loadOnDemand = new i0.EventEmitter();
7528
+ /**
7529
+ * Determines if list items should have swipe actions or not
7530
+ * - the order of swipe actions is used to determine edge actions,
7531
+ * as well as their order of appearance on the screen.
7532
+ */
7545
7533
  this.swipeActions = [];
7534
+ /**
7535
+ * Emitting event when an item is selected (tapped on mobile, clicked on web)
7536
+ */
7546
7537
  this.itemSelect = new i0.EventEmitter();
7538
+ this.disableSelectionHighlight = false;
7547
7539
  }
7548
7540
  Object.defineProperty(ListComponent.prototype, "isShapeRounded", {
7549
7541
  get: function () {
@@ -7559,47 +7551,6 @@
7559
7551
  enumerable: false,
7560
7552
  configurable: true
7561
7553
  });
7562
- ListComponent.prototype.getVirtualDataset = function (index, count) {
7563
- return __awaiter$9(this, void 0, void 0, function () {
7564
- var _this = this;
7565
- return __generator(this, function (_c) {
7566
- switch (_c.label) {
7567
- case 0: return [4 /*yield*/, new Promise(function (resolve) {
7568
- setTimeout(function () {
7569
- var itemSlice = _this.getItemsSlice(index, count);
7570
- // If we return less items than count, virtual scroll will interprete it as EOF and stop asking for more
7571
- if (itemSlice.length < count && _this.isLoadOnDemandEnabled) {
7572
- var elapsedTime_1 = 0;
7573
- /* As virtual scroll fixes the viewport causing ScrollEnd to not be emitted; do it manually to trigger load on demand */
7574
- _this.scrollDirective.scrollEnd.emit();
7575
- var poller_1 = setInterval(function () {
7576
- elapsedTime_1 += INTERVAL;
7577
- if (_this._isLoading) {
7578
- // Just a failsafe in case this.isLoading for some reason is not reset
7579
- if (elapsedTime_1 > _this.virtualScrollTimeout) {
7580
- clearInterval(poller_1);
7581
- resolve([]);
7582
- }
7583
- return;
7584
- }
7585
- clearInterval(poller_1);
7586
- resolve(_this.getItemsSlice(index, count));
7587
- }, INTERVAL);
7588
- }
7589
- else {
7590
- resolve(itemSlice);
7591
- }
7592
- }, INTERVAL);
7593
- })];
7594
- case 1: return [2 /*return*/, _c.sent()];
7595
- }
7596
- });
7597
- });
7598
- };
7599
- ListComponent.prototype.getItemsSlice = function (index, count) {
7600
- var _items = this._isSectionsEnabled ? this._virtualGroupedItems : this.items;
7601
- return _items.slice(index, index + count);
7602
- };
7603
7554
  ListComponent.prototype.ngOnInit = function () {
7604
7555
  this._isSelectable = this.itemSelect.observers.length > 0;
7605
7556
  if (this.isLoadOnDemandEnabled === undefined) {
@@ -7621,13 +7572,6 @@
7621
7572
  this._groupedItems = this._isSectionsEnabled
7622
7573
  ? this.groupBy.transform(this.items, this.getSectionName)
7623
7574
  : null;
7624
- this._virtualGroupedItems =
7625
- this.useVirtualScroll && this._groupedItems
7626
- ? this._groupedItems.reduce(function (accumulator, group) {
7627
- accumulator.push({ headingName: group.name });
7628
- return accumulator.concat.apply(accumulator, __spread(group.items));
7629
- }, [])
7630
- : null;
7631
7575
  };
7632
7576
  ListComponent.prototype._onLoadOnDemand = function (event) {
7633
7577
  this.listHelper.onLoadOnDemand(this, event);
@@ -7639,8 +7583,10 @@
7639
7583
  return section.name;
7640
7584
  };
7641
7585
  ListComponent.prototype.onItemSelect = function (item) {
7642
- this._selectedItem = item;
7643
- this.itemSelect.emit(this._selectedItem);
7586
+ if (!this.disableSelectionHighlight) {
7587
+ this._selectedItem = item;
7588
+ }
7589
+ this.itemSelect.emit(item);
7644
7590
  };
7645
7591
  ListComponent.prototype.onSwipeActionSelect = function (args) {
7646
7592
  args.swipeAction.onSelected(args.item);
@@ -7650,9 +7596,6 @@
7650
7596
  ListComponent.prototype._getBoundaryClass = function (index, section) {
7651
7597
  var _a, _b;
7652
7598
  var _items = section || this.items;
7653
- if (this._isSectionsEnabled && this.useVirtualScroll) {
7654
- _items = this._virtualGroupedItems;
7655
- }
7656
7599
  if (index === 0 || ((_a = _items[index - 1]) === null || _a === void 0 ? void 0 : _a.headingName))
7657
7600
  return this.headerTemplate ? null : 'first';
7658
7601
  if (index === _items.length - 1 || ((_b = _items[index + 1]) === null || _b === void 0 ? void 0 : _b.headingName))
@@ -7663,9 +7606,9 @@
7663
7606
  ListComponent.decorators = [
7664
7607
  { type: i0.Component, args: [{
7665
7608
  selector: 'kirby-list',
7666
- 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 <ion-list-header *ngIf=\"headerTemplate\">\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n </ion-list-header>\n\n <div\n *ngIf=\"useVirtualScroll\"\n #viewport\n [style.height]=\"virtualScrollViewportHeight + 'px'\"\n class=\"viewport\"\n >\n <ng-container\n *ngTemplateOutlet=\"virtualItemsTemplate; context: { $implicit: _virtualScrollData }\"\n ></ng-container>\n </div>\n\n <ng-container *ngIf=\"!useVirtualScroll\">\n <ng-container\n *ngTemplateOutlet=\"\n _isSectionsEnabled ? groupedListTemplate : itemsTemplate;\n context: { $implicit: items }\n \"\n ></ng-container>\n </ng-container>\n\n <div *ngIf=\"footerTemplate\" class=\"footer\">\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n </div>\n</ion-list>\n\n<p *ngIf=\"!isLoadOnDemandEnabled && noMoreItemsText\" class=\"no-more-items\">\n {{ noMoreItemsText }}\n</p>\n<div *ngIf=\"_isLoading\" class=\"loading\">\n <kirby-spinner></kirby-spinner>\n</div>\n\n<ng-template #groupedListTemplate>\n <ion-item-group *ngFor=\"let section of _groupedItems; trackBy: sectionTrackBy\">\n <ion-item-divider>\n <ng-container\n *ngTemplateOutlet=\"sectionHeaderTemplate; context: { $implicit: section.name }\"\n ></ng-container>\n </ion-item-divider>\n\n <div class=\"list-items\">\n <ng-container\n *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: section.items }\"\n ></ng-container>\n </div>\n </ion-item-group>\n</ng-template>\n\n<ng-template #itemsTemplate let-items>\n <kirby-list-item\n *ngFor=\"let item of items; let i = index; trackBy: trackBy || defaultTrackBy\"\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 >\n </kirby-list-item>\n</ng-template>\n\n<ng-template #virtualItemsTemplate let-virtualScrollData>\n <div *uiScroll=\"let item of virtualScrollData; let i = index\">\n <div [class.item-wrapper]=\"!item.headingName\" [class.section-header]=\"item.headingName\">\n <ion-item-divider *ngIf=\"item.headingName\" class=\"virtual-group\">\n <ng-container\n *ngTemplateOutlet=\"sectionHeaderTemplate; context: { $implicit: item.headingName }\"\n ></ng-container>\n </ion-item-divider>\n <kirby-list-item\n *ngIf=\"!item.headingName\"\n [item]=\"item\"\n [itemTemplate]=\"itemTemplate\"\n [swipeActions]=\"swipeActions\"\n [boundaryClass]=\"_getBoundaryClass(i)\"\n [isSelectable]=\"_isSelectable\"\n [getItemColor]=\"getItemColor\"\n [isSelected]=\"_isSelectable && item === _selectedItem\"\n (itemSelect)=\"onItemSelect($event)\"\n (swipeActionSelect)=\"onSwipeActionSelect($event)\"\n >\n </kirby-list-item>\n </div>\n </div>\n</ng-template>\n",
7609
+ 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 <ion-list-header *ngIf=\"headerTemplate\">\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n </ion-list-header>\n\n <ng-container\n *ngTemplateOutlet=\"\n _isSectionsEnabled ? groupedListTemplate : itemsTemplate;\n context: { $implicit: items }\n \"\n ></ng-container>\n\n <div *ngIf=\"footerTemplate\" class=\"footer\">\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n </div>\n</ion-list>\n\n<p *ngIf=\"!isLoadOnDemandEnabled && noMoreItemsText\" class=\"no-more-items\">\n {{ noMoreItemsText }}\n</p>\n<div *ngIf=\"_isLoading\" class=\"loading\">\n <kirby-spinner></kirby-spinner>\n</div>\n\n<ng-template #groupedListTemplate>\n <ion-item-group *ngFor=\"let section of _groupedItems; trackBy: sectionTrackBy\">\n <ion-item-divider>\n <ng-container\n *ngTemplateOutlet=\"sectionHeaderTemplate; context: { $implicit: section.name }\"\n ></ng-container>\n </ion-item-divider>\n\n <div class=\"list-items\">\n <ng-container\n *ngTemplateOutlet=\"itemsTemplate; context: { $implicit: section.items }\"\n ></ng-container>\n </div>\n </ion-item-group>\n</ng-template>\n\n<ng-template #itemsTemplate let-items>\n <kirby-list-item\n *ngFor=\"let item of items; let i = index; trackBy: trackBy || defaultTrackBy\"\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 >\n </kirby-list-item>\n</ng-template>\n",
7667
7610
  providers: [ListHelper, GroupByPipe],
7668
- styles: [":host{display:block}.list{box-shadow:0 5px 10px -10px rgba(28,28,28,.3),0 0 5px 0 rgba(28,28,28,.08);background:transparent;contain:inherit;padding:0}.viewport{overflow-y:auto}.item-wrapper{min-height:56px}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:14px;min-height:56px;overflow:visible;width:100%}ion-item-divider{font-weight:inherit}ion-item-sliding.item-sliding-active-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0)}ion-item-sliding.light{--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}.footer{background-color:var(--kirby-white);border-top:1px solid var(--kirby-background-color);display:flex;align-items:center;justify-content:space-between;width:100%}.loading,.no-more-items{width:100%;padding:24px 0;text-align:center}.swipe-action{display:flex;color:var(--kirby-black);background-color:transparent}.swipe-action .primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}.swipe-action .secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}.swipe-action .tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}.swipe-action .success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}.swipe-action .warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}.swipe-action .danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}.swipe-action .light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}.swipe-action .medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}.swipe-action .dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}.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{box-shadow:none}:host-context(.has-sections) .list-items{box-shadow:0 5px 10px -10px rgba(28,28,28,.3),0 0 5px 0 rgba(28,28,28,.08);border-radius:16px}:host-context(.has-sections) .virtual-group{margin-top:24px}:host-context(.has-sections) .section-header{overflow:hidden}:host-context(.has-sections) .footer{background-color:transparent;border-top:none}:host-context(.has-sections) ion-list-header{background-color:transparent;border-bottom:none}:host-context(.shape-rounded) .list,:host-context(.shape-rounded) .list-items{border-radius:16px}:host-context(.shape-rounded) ion-item-sliding.first,:host-context(.shape-rounded) ion-item.first,:host-context(.shape-rounded) ion-list-header{border-top-left-radius:16px;border-top-right-radius:16px;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}:host-context(.shape-rounded):not(.has-sections) .has-header ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item-sliding,:host-context(.shape-rounded) ion-item-sliding>ion-item{border-top-left-radius:0;border-top-right-radius:0}:host-context(.shape-rounded) .footer,:host-context(.shape-rounded) ion-item-sliding.last,:host-context(.shape-rounded) ion-item.last{border-bottom-left-radius:16px;border-bottom-right-radius:16px;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item-sliding,:host-context(.shape-rounded) ion-item-sliding>ion-item{border-bottom-left-radius:0;border-bottom-right-radius:0}:host-context(.shape-none) .list,:host-context(.shape-none) .list-items{box-shadow:none;border-radius:unset}:host-context(.shape-none) .list ion-item,:host-context(.shape-none) .list ion-item-sliding{--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;--inner-padding-start:0;--inner-padding-end:0;--inner-padding-top:0;--inner-padding-bottom:0;--background:none;--background-activated:none;--background-hover:none;--background-focused:none;overflow:visible}:host-context(.item-spacing) .list kirby-list-item{margin-bottom:16px}:host-context(.item-spacing) .list kirby-list-item:last-child,:host-context(.item-spacing) .list kirby-list-item>ion-item{margin-bottom:0}"]
7611
+ styles: [":host{display:block}.list{box-shadow:0 5px 10px -10px rgba(28,28,28,.3),0 0 5px 0 rgba(28,28,28,.08);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:14px;min-height:56px;overflow:visible;width:100%}ion-item-divider{font-weight:inherit}ion-item-sliding.item-sliding-active-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0)}ion-item-sliding.light{--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}.footer{background-color:var(--kirby-white);border-top:1px solid var(--kirby-background-color);display:flex;align-items:center;justify-content:space-between;width:100%}.loading,.no-more-items{width:100%;padding:24px 0;text-align:center}.swipe-action{display:flex;color:var(--kirby-black);background-color:transparent}.swipe-action .primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}.swipe-action .secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}.swipe-action .tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}.swipe-action .success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}.swipe-action .warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}.swipe-action .danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}.swipe-action .light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}.swipe-action .medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}.swipe-action .dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}.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{box-shadow:none}:host-context(.has-sections) .list-items{box-shadow:0 5px 10px -10px rgba(28,28,28,.3),0 0 5px 0 rgba(28,28,28,.08);border-radius:16px}:host-context(.has-sections) .footer{background-color:transparent;border-top:none}:host-context(.has-sections) ion-list-header{background-color:transparent;border-bottom:none}:host-context(.shape-rounded) .list,:host-context(.shape-rounded) .list-items{border-radius:16px}:host-context(.shape-rounded) ion-item-sliding.first,:host-context(.shape-rounded) ion-item.first,:host-context(.shape-rounded) ion-list-header{border-top-left-radius:16px;border-top-right-radius:16px;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}:host-context(.shape-rounded):not(.has-sections) .has-header ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item-sliding,:host-context(.shape-rounded) ion-item-sliding>ion-item{border-top-left-radius:0;border-top-right-radius:0}:host-context(.shape-rounded) .footer,:host-context(.shape-rounded) ion-item-sliding.last,:host-context(.shape-rounded) ion-item.last{border-bottom-left-radius:16px;border-bottom-right-radius:16px;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item-sliding,:host-context(.shape-rounded) ion-item-sliding>ion-item{border-bottom-left-radius:0;border-bottom-right-radius:0}:host-context(.shape-none) .list,:host-context(.shape-none) .list-items{box-shadow:none;border-radius:unset}:host-context(.shape-none) .list ion-item,:host-context(.shape-none) .list ion-item-sliding{--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;--inner-padding-start:0;--inner-padding-end:0;--inner-padding-top:0;--inner-padding-bottom:0;--background:none;--background-activated:none;--background-hover:none;--background-focused:none;overflow:visible}:host-context(.item-spacing) .list kirby-list-item{margin-bottom:16px}:host-context(.item-spacing) .list kirby-list-item:last-child,:host-context(.item-spacing) .list kirby-list-item>ion-item{margin-bottom:0}"]
7669
7612
  },] }
7670
7613
  ];
7671
7614
  /** @nocollapse */
@@ -7687,14 +7630,11 @@
7687
7630
  isShapeRounded: [{ type: i0.HostBinding, args: ['class.shape-rounded',] }],
7688
7631
  isShapeNone: [{ type: i0.HostBinding, args: ['class.shape-none',] }],
7689
7632
  hasItemSpacing: [{ type: i0.HostBinding, args: ['class.item-spacing',] }, { type: i0.Input }],
7690
- useVirtualScroll: [{ type: i0.Input }],
7691
- virtualScrollViewportHeight: [{ type: i0.Input }],
7692
- virtualScrollSettings: [{ type: i0.Input }],
7693
- virtualScrollTimeout: [{ type: i0.Input }],
7694
7633
  isLoadOnDemandEnabled: [{ type: i0.Input }],
7695
7634
  loadOnDemand: [{ type: i0.Output }],
7696
7635
  swipeActions: [{ type: i0.Input }],
7697
7636
  itemSelect: [{ type: i0.Output }],
7637
+ disableSelectionHighlight: [{ type: i0.Input }],
7698
7638
  kirbyItems: [{ type: i0.ContentChildren, args: [ItemComponent,] }],
7699
7639
  headerTemplate: [{ type: i0.ContentChild, args: [ListHeaderDirective, { static: false, read: i0.TemplateRef },] }],
7700
7640
  sectionHeaderTemplate: [{ type: i0.ContentChild, args: [ListSectionHeaderDirective, { static: false, read: i0.TemplateRef },] }],
@@ -7835,7 +7775,7 @@
7835
7775
  { type: i0.Component, args: [{
7836
7776
  selector: 'kirby-list-item',
7837
7777
  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 <ion-item-options *ngIf=\"_hasSwipeActions(item)\" [side]=\"_getSwipeActionEnd(item)\">\n <div class=\"swipe-action\">\n <ng-container *ngFor=\"let swipeAction of _getSwipeActions(item)\">\n <ion-item-option\n [ngClass]=\"_getSwipeActionType(swipeAction, item)\"\n (click)=\"_onSwipeActionSelect(swipeAction, item, $event)\"\n >\n <div class=\"item-content\">\n <kirby-icon\n *ngIf=\"_getSwipeActionIcon(swipeAction, item)\"\n size=\"sm\"\n [name]=\"_getSwipeActionIcon(swipeAction, item)\"\n >\n </kirby-icon>\n <ion-label>\n {{ _getSwipeActionTitle(swipeAction, item) }}\n </ion-label>\n </div>\n </ion-item-option>\n </ng-container>\n </div>\n </ion-item-options>\n</ng-template>\n",
7838
- styles: [":host{display:block}.list{box-shadow:0 5px 10px -10px rgba(28,28,28,.3),0 0 5px 0 rgba(28,28,28,.08);background:transparent;contain:inherit;padding:0}.viewport{overflow-y:auto}.item-wrapper{min-height:56px}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:14px;min-height:56px;overflow:visible;width:100%}ion-item-divider{font-weight:inherit}ion-item-sliding.item-sliding-active-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0)}ion-item-sliding.light{--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}.footer{background-color:var(--kirby-white);border-top:1px solid var(--kirby-background-color);display:flex;align-items:center;justify-content:space-between;width:100%}.loading,.no-more-items{width:100%;padding:24px 0;text-align:center}.swipe-action{display:flex;color:var(--kirby-black);background-color:transparent}.swipe-action .primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}.swipe-action .secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}.swipe-action .tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}.swipe-action .success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}.swipe-action .warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}.swipe-action .danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}.swipe-action .light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}.swipe-action .medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}.swipe-action .dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}.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{box-shadow:none}:host-context(.has-sections) .list-items{box-shadow:0 5px 10px -10px rgba(28,28,28,.3),0 0 5px 0 rgba(28,28,28,.08);border-radius:16px}:host-context(.has-sections) .virtual-group{margin-top:24px}:host-context(.has-sections) .section-header{overflow:hidden}:host-context(.has-sections) .footer{background-color:transparent;border-top:none}:host-context(.has-sections) ion-list-header{background-color:transparent;border-bottom:none}:host-context(.shape-rounded) .list,:host-context(.shape-rounded) .list-items{border-radius:16px}:host-context(.shape-rounded) ion-item-sliding.first,:host-context(.shape-rounded) ion-item.first,:host-context(.shape-rounded) ion-list-header{border-top-left-radius:16px;border-top-right-radius:16px;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}:host-context(.shape-rounded):not(.has-sections) .has-header ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item-sliding,:host-context(.shape-rounded) ion-item-sliding>ion-item{border-top-left-radius:0;border-top-right-radius:0}:host-context(.shape-rounded) .footer,:host-context(.shape-rounded) ion-item-sliding.last,:host-context(.shape-rounded) ion-item.last{border-bottom-left-radius:16px;border-bottom-right-radius:16px;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item-sliding,:host-context(.shape-rounded) ion-item-sliding>ion-item{border-bottom-left-radius:0;border-bottom-right-radius:0}:host-context(.shape-none) .list,:host-context(.shape-none) .list-items{box-shadow:none;border-radius:unset}:host-context(.shape-none) .list ion-item,:host-context(.shape-none) .list ion-item-sliding{--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;--inner-padding-start:0;--inner-padding-end:0;--inner-padding-top:0;--inner-padding-bottom:0;--background:none;--background-activated:none;--background-hover:none;--background-focused:none;overflow:visible}:host-context(.item-spacing) .list kirby-list-item{margin-bottom:16px}:host-context(.item-spacing) .list kirby-list-item:last-child,:host-context(.item-spacing) .list kirby-list-item>ion-item{margin-bottom:0}", ":host{overflow:hidden}:host-context(.has-divider) ion-item-sliding:not(.last){border-bottom:1px solid var(--kirby-background-color)}"]
7778
+ styles: [":host{display:block}.list{box-shadow:0 5px 10px -10px rgba(28,28,28,.3),0 0 5px 0 rgba(28,28,28,.08);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:14px;min-height:56px;overflow:visible;width:100%}ion-item-divider{font-weight:inherit}ion-item-sliding.item-sliding-active-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0)}ion-item-sliding.light{--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}.footer{background-color:var(--kirby-white);border-top:1px solid var(--kirby-background-color);display:flex;align-items:center;justify-content:space-between;width:100%}.loading,.no-more-items{width:100%;padding:24px 0;text-align:center}.swipe-action{display:flex;color:var(--kirby-black);background-color:transparent}.swipe-action .primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}.swipe-action .secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}.swipe-action .tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}.swipe-action .success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}.swipe-action .warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}.swipe-action .danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}.swipe-action .light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}.swipe-action .medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}.swipe-action .dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}.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{box-shadow:none}:host-context(.has-sections) .list-items{box-shadow:0 5px 10px -10px rgba(28,28,28,.3),0 0 5px 0 rgba(28,28,28,.08);border-radius:16px}:host-context(.has-sections) .footer{background-color:transparent;border-top:none}:host-context(.has-sections) ion-list-header{background-color:transparent;border-bottom:none}:host-context(.shape-rounded) .list,:host-context(.shape-rounded) .list-items{border-radius:16px}:host-context(.shape-rounded) ion-item-sliding.first,:host-context(.shape-rounded) ion-item.first,:host-context(.shape-rounded) ion-list-header{border-top-left-radius:16px;border-top-right-radius:16px;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}:host-context(.shape-rounded):not(.has-sections) .has-header ion-item,:host-context(.shape-rounded):not(.has-sections) .has-header ion-item-sliding,:host-context(.shape-rounded) ion-item-sliding>ion-item{border-top-left-radius:0;border-top-right-radius:0}:host-context(.shape-rounded) .footer,:host-context(.shape-rounded) ion-item-sliding.last,:host-context(.shape-rounded) ion-item.last{border-bottom-left-radius:16px;border-bottom-right-radius:16px;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item,:host-context(.shape-rounded):not(.has-sections) .has-footer ion-item-sliding,:host-context(.shape-rounded) ion-item-sliding>ion-item{border-bottom-left-radius:0;border-bottom-right-radius:0}:host-context(.shape-none) .list,:host-context(.shape-none) .list-items{box-shadow:none;border-radius:unset}:host-context(.shape-none) .list ion-item,:host-context(.shape-none) .list ion-item-sliding{--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;--inner-padding-start:0;--inner-padding-end:0;--inner-padding-top:0;--inner-padding-bottom:0;--background:none;--background-activated:none;--background-hover:none;--background-focused:none;overflow:visible}:host-context(.item-spacing) .list kirby-list-item{margin-bottom:16px}:host-context(.item-spacing) .list kirby-list-item:last-child,:host-context(.item-spacing) .list kirby-list-item>ion-item{margin-bottom:0}", ":host{overflow:hidden}:host-context(.has-divider) ion-item-sliding:not(.last){border-bottom:1px solid var(--kirby-background-color)}"]
7839
7779
  },] }
7840
7780
  ];
7841
7781
  /** @nocollapse */
@@ -7881,6 +7821,18 @@
7881
7821
  color: [{ type: i0.HostBinding, args: ['class',] }]
7882
7822
  };
7883
7823
 
7824
+ var ListExperimentalComponent = /** @class */ (function () {
7825
+ function ListExperimentalComponent() {
7826
+ }
7827
+ return ListExperimentalComponent;
7828
+ }());
7829
+ ListExperimentalComponent.decorators = [
7830
+ { type: i0.Component, args: [{
7831
+ selector: 'kirby-list-experimental',
7832
+ template: "<ion-list>\n <ng-content></ng-content>\n</ion-list>\n"
7833
+ },] }
7834
+ ];
7835
+
7884
7836
  var ReorderEvent = /** @class */ (function () {
7885
7837
  function ReorderEvent(ev, parentItem) {
7886
7838
  this.origEvent = ev;
@@ -8909,7 +8861,7 @@
8909
8861
  },] }
8910
8862
  ];
8911
8863
 
8912
- var __awaiter$a = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
8864
+ var __awaiter$9 = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
8913
8865
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
8914
8866
  return new (P || (P = Promise))(function (resolve, reject) {
8915
8867
  function fulfilled(value) { try {
@@ -8933,7 +8885,7 @@
8933
8885
  this.toastController = toastController;
8934
8886
  }
8935
8887
  ToastHelper.prototype.showToast = function (config) {
8936
- return __awaiter$a(this, void 0, void 0, function () {
8888
+ return __awaiter$9(this, void 0, void 0, function () {
8937
8889
  var toast;
8938
8890
  return __generator(this, function (_a) {
8939
8891
  switch (_a.label) {
@@ -9654,6 +9606,7 @@
9654
9606
  ListHeaderDirective,
9655
9607
  ListHeaderComponent,
9656
9608
  ListFooterDirective,
9609
+ ListExperimentalComponent,
9657
9610
  ];
9658
9611
  var declarations = __spread(exportedDeclarations, [
9659
9612
  ListItemColorDirective,
@@ -9668,7 +9621,7 @@
9668
9621
  ListModule.decorators = [
9669
9622
  { type: i0.NgModule, args: [{
9670
9623
  declarations: declarations,
9671
- imports: [common.CommonModule, IconModule, i1.IonicModule, SpinnerModule, ngxUiScroll.UiScrollModule],
9624
+ imports: [common.CommonModule, IconModule, i1.IonicModule, SpinnerModule],
9672
9625
  exports: exportedDeclarations,
9673
9626
  providers: [],
9674
9627
  },] }
@@ -9932,7 +9885,6 @@
9932
9885
  imports: __spread([
9933
9886
  common.CommonModule,
9934
9887
  i1$1.RouterModule,
9935
- ngxUiScroll.UiScrollModule,
9936
9888
  i1.IonicModule.forRoot({
9937
9889
  mode: 'ios',
9938
9890
  inputShims: true,
@@ -10054,6 +10006,7 @@
10054
10006
  exports.KirbyModule = KirbyModule;
10055
10007
  exports.LabelComponent = LabelComponent;
10056
10008
  exports.ListComponent = ListComponent;
10009
+ exports.ListExperimentalComponent = ListExperimentalComponent;
10057
10010
  exports.ListFlexItemDirective = ListFlexItemDirective;
10058
10011
  exports.ListFooterDirective = ListFooterDirective;
10059
10012
  exports.ListHeaderComponent = ListHeaderComponent;
@@ -10152,77 +10105,78 @@
10152
10105
  exports.ɵch = ListItemComponent;
10153
10106
  exports.ɵci = ListSectionHeaderComponent;
10154
10107
  exports.ɵcj = ListHeaderComponent;
10155
- exports.ɵck = ListItemColorDirective;
10156
- exports.ɵcl = ChartModule;
10157
- exports.ɵcm = ChartComponent;
10158
- exports.ɵcn = ChartJSService;
10159
- exports.ɵco = ChartConfigService;
10160
- exports.ɵcp = CardComponent;
10161
- exports.ɵcq = CardHeaderComponent;
10162
- exports.ɵcr = CardFooterComponent;
10163
- exports.ɵcs = ChartDeprecatedComponent;
10164
- exports.ɵct = ChartDeprecatedHelper;
10165
- exports.ɵcu = DONUT_OPTIONS;
10166
- exports.ɵcv = DonutOptions;
10167
- exports.ɵcw = AREASPLINE_OPTIONS;
10168
- exports.ɵcx = AreaSplineOptions;
10169
- exports.ɵcy = TIMESERIES_OPTIONS;
10170
- exports.ɵcz = TimeSeriesOptions;
10108
+ exports.ɵck = ListExperimentalComponent;
10109
+ exports.ɵcl = ListItemColorDirective;
10110
+ exports.ɵcm = ChartModule;
10111
+ exports.ɵcn = ChartComponent;
10112
+ exports.ɵco = ChartJSService;
10113
+ exports.ɵcp = ChartConfigService;
10114
+ exports.ɵcq = CardComponent;
10115
+ exports.ɵcr = CardHeaderComponent;
10116
+ exports.ɵcs = CardFooterComponent;
10117
+ exports.ɵct = ChartDeprecatedComponent;
10118
+ exports.ɵcu = ChartDeprecatedHelper;
10119
+ exports.ɵcv = DONUT_OPTIONS;
10120
+ exports.ɵcw = DonutOptions;
10121
+ exports.ɵcx = AREASPLINE_OPTIONS;
10122
+ exports.ɵcy = AreaSplineOptions;
10123
+ exports.ɵcz = TIMESERIES_OPTIONS;
10171
10124
  exports.ɵd = RouterOutletComponent;
10172
- exports.ɵda = ACTIVITYGAUGE_OPTIONS;
10173
- exports.ɵdb = ActivityGaugeOptions;
10174
- exports.ɵdc = StockChartDeprecatedComponent;
10175
- exports.ɵdd = GridComponent;
10176
- exports.ɵde = BreakpointHelperService;
10177
- exports.ɵdf = ComponentLoaderDirective;
10178
- exports.ɵdg = AvatarComponent;
10179
- exports.ɵdh = CalendarComponent;
10180
- exports.ɵdi = CalendarHelper;
10181
- exports.ɵdj = CheckboxComponent;
10182
- exports.ɵdk = ActionSheetComponent;
10183
- exports.ɵdl = ModalFooterComponent;
10184
- exports.ɵdm = ModalRouterLinkDirective;
10185
- exports.ɵdn = SegmentedControlComponent;
10186
- exports.ɵdo = ChipComponent;
10187
- exports.ɵdp = ThemeColorDirective;
10188
- exports.ɵdq = DateInputDirective;
10189
- exports.ɵdr = DecimalMaskDirective;
10190
- exports.ɵds = SlideButtonComponent;
10191
- exports.ɵdt = ToggleComponent;
10192
- exports.ɵdu = EmptyStateComponent;
10193
- exports.ɵdv = FormFieldComponent;
10194
- exports.ɵdw = InputCounterComponent;
10195
- exports.ɵdx = RadioGroupComponent;
10196
- exports.ɵdy = RadioComponent;
10197
- exports.ɵdz = InputComponent;
10125
+ exports.ɵda = TimeSeriesOptions;
10126
+ exports.ɵdb = ACTIVITYGAUGE_OPTIONS;
10127
+ exports.ɵdc = ActivityGaugeOptions;
10128
+ exports.ɵdd = StockChartDeprecatedComponent;
10129
+ exports.ɵde = GridComponent;
10130
+ exports.ɵdf = BreakpointHelperService;
10131
+ exports.ɵdg = ComponentLoaderDirective;
10132
+ exports.ɵdh = AvatarComponent;
10133
+ exports.ɵdi = CalendarComponent;
10134
+ exports.ɵdj = CalendarHelper;
10135
+ exports.ɵdk = CheckboxComponent;
10136
+ exports.ɵdl = ActionSheetComponent;
10137
+ exports.ɵdm = ModalFooterComponent;
10138
+ exports.ɵdn = ModalRouterLinkDirective;
10139
+ exports.ɵdo = SegmentedControlComponent;
10140
+ exports.ɵdp = ChipComponent;
10141
+ exports.ɵdq = ThemeColorDirective;
10142
+ exports.ɵdr = DateInputDirective;
10143
+ exports.ɵds = DecimalMaskDirective;
10144
+ exports.ɵdt = SlideButtonComponent;
10145
+ exports.ɵdu = ToggleComponent;
10146
+ exports.ɵdv = EmptyStateComponent;
10147
+ exports.ɵdw = FormFieldComponent;
10148
+ exports.ɵdx = InputCounterComponent;
10149
+ exports.ɵdy = RadioGroupComponent;
10150
+ exports.ɵdz = RadioComponent;
10198
10151
  exports.ɵe = ModalController;
10199
- exports.ɵea = TextareaComponent;
10200
- exports.ɵeb = FabSheetComponent;
10201
- exports.ɵec = DividerComponent;
10202
- exports.ɵed = ReorderListComponent;
10203
- exports.ɵee = DropdownComponent;
10204
- exports.ɵef = PopoverComponent;
10205
- exports.ɵeg = KeyboardHandlerService;
10206
- exports.ɵeh = LoadingOverlayComponent;
10207
- exports.ɵei = ProgressCircleComponent;
10208
- exports.ɵej = FlagComponent;
10209
- exports.ɵek = SlideDirective;
10210
- exports.ɵel = SlidesComponent;
10211
- exports.ɵem = AccordionDirective;
10212
- exports.ɵen = AccordionItemComponent;
10213
- exports.ɵeo = RangeComponent;
10214
- exports.ɵep = ElementAsButtonDirective;
10215
- exports.ɵeq = KeyHandlerDirective;
10216
- exports.ɵer = FormFieldMessageComponent;
10217
- exports.ɵes = AlertComponent;
10218
- exports.ɵet = ModalCompactWrapperComponent;
10219
- exports.ɵeu = ProgressCircleRingComponent;
10220
- exports.ɵev = ToastHelper;
10221
- exports.ɵew = ToastController;
10222
- exports.ɵex = LoadingOverlayService;
10223
- exports.ɵey = appInitialize;
10224
- exports.ɵez = customElementsInitializer;
10152
+ exports.ɵea = InputComponent;
10153
+ exports.ɵeb = TextareaComponent;
10154
+ exports.ɵec = FabSheetComponent;
10155
+ exports.ɵed = DividerComponent;
10156
+ exports.ɵee = ReorderListComponent;
10157
+ exports.ɵef = DropdownComponent;
10158
+ exports.ɵeg = PopoverComponent;
10159
+ exports.ɵeh = KeyboardHandlerService;
10160
+ exports.ɵei = LoadingOverlayComponent;
10161
+ exports.ɵej = ProgressCircleComponent;
10162
+ exports.ɵek = FlagComponent;
10163
+ exports.ɵel = SlideDirective;
10164
+ exports.ɵem = SlidesComponent;
10165
+ exports.ɵen = AccordionDirective;
10166
+ exports.ɵeo = AccordionItemComponent;
10167
+ exports.ɵep = RangeComponent;
10168
+ exports.ɵeq = ElementAsButtonDirective;
10169
+ exports.ɵer = KeyHandlerDirective;
10170
+ exports.ɵes = FormFieldMessageComponent;
10171
+ exports.ɵet = AlertComponent;
10172
+ exports.ɵeu = ModalCompactWrapperComponent;
10173
+ exports.ɵev = ProgressCircleRingComponent;
10174
+ exports.ɵew = ToastHelper;
10175
+ exports.ɵex = ToastController;
10176
+ exports.ɵey = LoadingOverlayService;
10177
+ exports.ɵez = appInitialize;
10225
10178
  exports.ɵf = ModalHelper;
10179
+ exports.ɵfa = customElementsInitializer;
10226
10180
  exports.ɵg = ModalAnimationBuilderService;
10227
10181
  exports.ɵh = PlatformService;
10228
10182
  exports.ɵi = WindowRef;