@kirbydesign/designsystem 12.0.0-dev-67d5287 → 12.0.0-dev-286cdc0

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 (96) hide show
  1. package/fesm2022/kirbydesign-designsystem-accordion.mjs +12 -12
  2. package/fesm2022/kirbydesign-designsystem-accordion.mjs.map +1 -1
  3. package/fesm2022/kirbydesign-designsystem-action-group.mjs +3 -3
  4. package/fesm2022/kirbydesign-designsystem-avatar.mjs +5 -5
  5. package/fesm2022/kirbydesign-designsystem-avatar.mjs.map +1 -1
  6. package/fesm2022/kirbydesign-designsystem-badge.mjs +5 -5
  7. package/fesm2022/kirbydesign-designsystem-badge.mjs.map +1 -1
  8. package/fesm2022/kirbydesign-designsystem-button.mjs +5 -5
  9. package/fesm2022/kirbydesign-designsystem-button.mjs.map +1 -1
  10. package/fesm2022/kirbydesign-designsystem-calendar.mjs +7 -7
  11. package/fesm2022/kirbydesign-designsystem-calendar.mjs.map +1 -1
  12. package/fesm2022/kirbydesign-designsystem-card.mjs +24 -24
  13. package/fesm2022/kirbydesign-designsystem-card.mjs.map +1 -1
  14. package/fesm2022/kirbydesign-designsystem-chart.mjs +22 -22
  15. package/fesm2022/kirbydesign-designsystem-checkbox.mjs +14 -6
  16. package/fesm2022/kirbydesign-designsystem-checkbox.mjs.map +1 -1
  17. package/fesm2022/kirbydesign-designsystem-data-table.mjs +7 -7
  18. package/fesm2022/kirbydesign-designsystem-divider.mjs +5 -5
  19. package/fesm2022/kirbydesign-designsystem-divider.mjs.map +1 -1
  20. package/fesm2022/kirbydesign-designsystem-dropdown.mjs +10 -10
  21. package/fesm2022/kirbydesign-designsystem-empty-state.mjs +19 -8
  22. package/fesm2022/kirbydesign-designsystem-empty-state.mjs.map +1 -1
  23. package/fesm2022/kirbydesign-designsystem-fab-sheet.mjs +3 -3
  24. package/fesm2022/kirbydesign-designsystem-flag.mjs +5 -5
  25. package/fesm2022/kirbydesign-designsystem-flag.mjs.map +1 -1
  26. package/fesm2022/kirbydesign-designsystem-form-field.mjs +32 -32
  27. package/fesm2022/kirbydesign-designsystem-form-field.mjs.map +1 -1
  28. package/fesm2022/kirbydesign-designsystem-gesture.mjs +3 -3
  29. package/fesm2022/kirbydesign-designsystem-header.mjs +19 -19
  30. package/fesm2022/kirbydesign-designsystem-helpers.mjs +9 -9
  31. package/fesm2022/kirbydesign-designsystem-icon.mjs +10 -10
  32. package/fesm2022/kirbydesign-designsystem-item-group.mjs +3 -3
  33. package/fesm2022/kirbydesign-designsystem-item-sliding.mjs +3 -3
  34. package/fesm2022/kirbydesign-designsystem-item.mjs +12 -12
  35. package/fesm2022/kirbydesign-designsystem-item.mjs.map +1 -1
  36. package/fesm2022/kirbydesign-designsystem-kirby-app.mjs +7 -7
  37. package/fesm2022/kirbydesign-designsystem-list.mjs +49 -46
  38. package/fesm2022/kirbydesign-designsystem-list.mjs.map +1 -1
  39. package/fesm2022/kirbydesign-designsystem-loading-overlay.mjs +8 -8
  40. package/fesm2022/kirbydesign-designsystem-loading-overlay.mjs.map +1 -1
  41. package/fesm2022/kirbydesign-designsystem-menu.mjs +5 -5
  42. package/fesm2022/kirbydesign-designsystem-menu.mjs.map +1 -1
  43. package/fesm2022/kirbydesign-designsystem-modal.mjs +59 -50
  44. package/fesm2022/kirbydesign-designsystem-modal.mjs.map +1 -1
  45. package/fesm2022/kirbydesign-designsystem-page.mjs +69 -48
  46. package/fesm2022/kirbydesign-designsystem-page.mjs.map +1 -1
  47. package/fesm2022/kirbydesign-designsystem-popover.mjs +3 -3
  48. package/fesm2022/kirbydesign-designsystem-progress-circle.mjs +6 -6
  49. package/fesm2022/kirbydesign-designsystem-radio.mjs +12 -12
  50. package/fesm2022/kirbydesign-designsystem-radio.mjs.map +1 -1
  51. package/fesm2022/kirbydesign-designsystem-range.mjs +5 -5
  52. package/fesm2022/kirbydesign-designsystem-range.mjs.map +1 -1
  53. package/fesm2022/kirbydesign-designsystem-reorder-list.mjs +5 -5
  54. package/fesm2022/kirbydesign-designsystem-reorder-list.mjs.map +1 -1
  55. package/fesm2022/kirbydesign-designsystem-router-outlet.mjs +7 -7
  56. package/fesm2022/kirbydesign-designsystem-section-header.mjs +3 -3
  57. package/fesm2022/kirbydesign-designsystem-segmented-control.mjs +5 -5
  58. package/fesm2022/kirbydesign-designsystem-segmented-control.mjs.map +1 -1
  59. package/fesm2022/kirbydesign-designsystem-shared-floating.mjs +16 -7
  60. package/fesm2022/kirbydesign-designsystem-shared-floating.mjs.map +1 -1
  61. package/fesm2022/kirbydesign-designsystem-shared-portal.mjs +3 -3
  62. package/fesm2022/kirbydesign-designsystem-shared.mjs +21 -21
  63. package/fesm2022/kirbydesign-designsystem-slide-button.mjs +3 -3
  64. package/fesm2022/kirbydesign-designsystem-slide.mjs +13 -13
  65. package/fesm2022/kirbydesign-designsystem-spinner.mjs +7 -7
  66. package/fesm2022/kirbydesign-designsystem-tab-navigation.mjs +12 -12
  67. package/fesm2022/kirbydesign-designsystem-tab-navigation.mjs.map +1 -1
  68. package/fesm2022/kirbydesign-designsystem-tabs.mjs +15 -15
  69. package/fesm2022/kirbydesign-designsystem-tabs.mjs.map +1 -1
  70. package/fesm2022/kirbydesign-designsystem-testing-base.mjs +305 -303
  71. package/fesm2022/kirbydesign-designsystem-testing-base.mjs.map +1 -1
  72. package/fesm2022/kirbydesign-designsystem-testing-jasmine.mjs +4 -4
  73. package/fesm2022/kirbydesign-designsystem-testing-jest.mjs +4 -4
  74. package/fesm2022/kirbydesign-designsystem-testing.mjs +4 -4
  75. package/fesm2022/kirbydesign-designsystem-toast.mjs +6 -6
  76. package/fesm2022/kirbydesign-designsystem-toggle-button.mjs +7 -7
  77. package/fesm2022/kirbydesign-designsystem-toggle.mjs +5 -5
  78. package/fesm2022/kirbydesign-designsystem-toggle.mjs.map +1 -1
  79. package/fesm2022/kirbydesign-designsystem-types.mjs +3 -3
  80. package/fesm2022/kirbydesign-designsystem.mjs +10 -10
  81. package/package.json +2 -2
  82. package/types/kirbydesign-designsystem-card.d.ts +2 -2
  83. package/types/kirbydesign-designsystem-card.d.ts.map +1 -1
  84. package/types/kirbydesign-designsystem-checkbox.d.ts +7 -1
  85. package/types/kirbydesign-designsystem-checkbox.d.ts.map +1 -1
  86. package/types/kirbydesign-designsystem-empty-state.d.ts +11 -0
  87. package/types/kirbydesign-designsystem-empty-state.d.ts.map +1 -1
  88. package/types/kirbydesign-designsystem-list.d.ts +5 -0
  89. package/types/kirbydesign-designsystem-list.d.ts.map +1 -1
  90. package/types/kirbydesign-designsystem-modal.d.ts +2 -1
  91. package/types/kirbydesign-designsystem-modal.d.ts.map +1 -1
  92. package/types/kirbydesign-designsystem-page.d.ts +4 -0
  93. package/types/kirbydesign-designsystem-page.d.ts.map +1 -1
  94. package/types/kirbydesign-designsystem-shared-floating.d.ts.map +1 -1
  95. package/types/kirbydesign-designsystem-testing-base.d.ts +5 -0
  96. package/types/kirbydesign-designsystem-testing-base.d.ts.map +1 -1
package/fesm2022/kirbydesign-designsystem-modal.mjs CHANGED
@@ -43,7 +43,7 @@ var ModalElementComponent = class ModalElementComponent {
43
43
  static {
44
44
  this.ɵfac = i0.ɵɵngDeclareFactory({
45
45
  minVersion: "12.0.0",
46
- version: "22.2.2",
46
+ version: "22.2.3",
47
47
  ngImport: i0,
48
48
  type: ModalElementComponent,
49
49
  deps: [
@@ -60,7 +60,7 @@ var ModalElementComponent = class ModalElementComponent {
60
60
  static {
61
61
  this.ɵcmp = i0.ɵɵngDeclareComponent({
62
62
  minVersion: "14.0.0",
63
- version: "22.2.2",
63
+ version: "22.2.3",
64
64
  type: ModalElementComponent,
65
65
  isStandalone: false,
66
66
  selector: "ng-component",
@@ -73,7 +73,7 @@ var ModalElementComponent = class ModalElementComponent {
73
73
  };
74
74
  i0.ɵɵngDeclareClassMetadata({
75
75
  minVersion: "12.0.0",
76
- version: "22.2.2",
76
+ version: "22.2.3",
77
77
  ngImport: i0,
78
78
  type: ModalElementComponent,
79
79
  decorators: [{
@@ -173,7 +173,7 @@ var AlertComponent = class AlertComponent {
173
173
  static {
174
174
  this.ɵfac = i0.ɵɵngDeclareFactory({
175
175
  minVersion: "12.0.0",
176
- version: "22.2.2",
176
+ version: "22.2.3",
177
177
  ngImport: i0,
178
178
  type: AlertComponent,
179
179
  deps: [{ token: i0.ElementRef }, { token: i1$2.WindowRef }],
@@ -183,7 +183,7 @@ var AlertComponent = class AlertComponent {
183
183
  static {
184
184
  this.ɵcmp = i0.ɵɵngDeclareComponent({
185
185
  minVersion: "17.0.0",
186
- version: "22.2.2",
186
+ version: "22.2.3",
187
187
  type: AlertComponent,
188
188
  isStandalone: true,
189
189
  selector: "kirby-alert",
@@ -206,7 +206,7 @@ var AlertComponent = class AlertComponent {
206
206
  }],
207
207
  ngImport: i0,
208
208
  template: "<article #alertWrapper>\n <kirby-empty-state\n [iconName]=\"iconName\"\n [themeColor]=\"iconThemeColor\"\n [title]=\"title$ | async\"\n [subtitle]=\"message$ | async\"\n ></kirby-empty-state>\n <div class=\"buttongroup\">\n @if (cancelBtn$ | async; as cancelBtn) {\n <button kirby-button attentionLevel=\"3\" class=\"cancel-btn\" (click)=\"onCancel()\">\n {{ cancelBtn }}\n </button>\n }\n <button\n kirby-button\n [size]=\"(cancelBtn$ | async) ? null : 'lg'\"\n attentionLevel=\"1\"\n class=\"ok-btn\"\n [class.destructive]=\"okBtnIsDestructive\"\n (click)=\"onOk()\"\n >\n {{ okBtn$ | async }}\n </button>\n </div>\n</article>\n",
209
- styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}article{overflow:hidden;padding:var(--kirby-spacing-s);padding-top:var(--kirby-spacing-m)}@media(max-width:320px){article{padding:var(--kirby-spacing-xxs)}}article{color:var(--kirby-color-content-base)}.buttongroup{display:flex;justify-content:center;column-gap:var(--kirby-spacing-xxs);flex-wrap:wrap}.buttongroup button{flex:0 1 calc(50% - var(--kirby-spacing-xxs) / 2);margin-inline:0}.buttongroup button:not(:only-child){flex-grow:1;min-width:unset}\n"],
209
+ styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}article{overflow:hidden;padding:var(--kirby-spacing-s);padding-top:var(--kirby-spacing-m);color:var(--kirby-color-content-base)}@media(max-width:320px){article{padding:var(--kirby-spacing-xxs)}}.buttongroup{display:flex;justify-content:center;column-gap:var(--kirby-spacing-xxs);flex-wrap:wrap}.buttongroup button{flex:0 1 calc(50% - var(--kirby-spacing-xxs) / 2);margin-inline:0}.buttongroup button:not(:only-child){flex-grow:1;min-width:unset}\n"],
210
210
  dependencies: [
211
211
  {
212
212
  kind: "component",
@@ -215,7 +215,8 @@ var AlertComponent = class AlertComponent {
215
215
  inputs: [
216
216
  "iconName",
217
217
  "title",
218
- "subtitle"
218
+ "subtitle",
219
+ "themeColor"
219
220
  ]
220
221
  },
221
222
  {
@@ -254,7 +255,7 @@ var AlertComponent = class AlertComponent {
254
255
  };
255
256
  i0.ɵɵngDeclareClassMetadata({
256
257
  minVersion: "12.0.0",
257
- version: "22.2.2",
258
+ version: "22.2.3",
258
259
  ngImport: i0,
259
260
  type: AlertComponent,
260
261
  decorators: [{
@@ -271,7 +272,7 @@ i0.ɵɵngDeclareClassMetadata({
271
272
  host: { "[class.ion-page]": "false" },
272
273
  changeDetection: ChangeDetectionStrategy.OnPush,
273
274
  template: "<article #alertWrapper>\n <kirby-empty-state\n [iconName]=\"iconName\"\n [themeColor]=\"iconThemeColor\"\n [title]=\"title$ | async\"\n [subtitle]=\"message$ | async\"\n ></kirby-empty-state>\n <div class=\"buttongroup\">\n @if (cancelBtn$ | async; as cancelBtn) {\n <button kirby-button attentionLevel=\"3\" class=\"cancel-btn\" (click)=\"onCancel()\">\n {{ cancelBtn }}\n </button>\n }\n <button\n kirby-button\n [size]=\"(cancelBtn$ | async) ? null : 'lg'\"\n attentionLevel=\"1\"\n class=\"ok-btn\"\n [class.destructive]=\"okBtnIsDestructive\"\n (click)=\"onOk()\"\n >\n {{ okBtn$ | async }}\n </button>\n </div>\n</article>\n",
274
- styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}article{overflow:hidden;padding:var(--kirby-spacing-s);padding-top:var(--kirby-spacing-m)}@media(max-width:320px){article{padding:var(--kirby-spacing-xxs)}}article{color:var(--kirby-color-content-base)}.buttongroup{display:flex;justify-content:center;column-gap:var(--kirby-spacing-xxs);flex-wrap:wrap}.buttongroup button{flex:0 1 calc(50% - var(--kirby-spacing-xxs) / 2);margin-inline:0}.buttongroup button:not(:only-child){flex-grow:1;min-width:unset}\n"]
275
+ styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}article{overflow:hidden;padding:var(--kirby-spacing-s);padding-top:var(--kirby-spacing-m);color:var(--kirby-color-content-base)}@media(max-width:320px){article{padding:var(--kirby-spacing-xxs)}}.buttongroup{display:flex;justify-content:center;column-gap:var(--kirby-spacing-xxs);flex-wrap:wrap}.buttongroup button{flex:0 1 calc(50% - var(--kirby-spacing-xxs) / 2);margin-inline:0}.buttongroup button:not(:only-child){flex-grow:1;min-width:unset}\n"]
275
276
  }]
276
277
  }],
277
278
  ctorParameters: () => [{ type: i0.ElementRef }, { type: i1$2.WindowRef }],
@@ -331,7 +332,7 @@ var AlertHelper = class AlertHelper {
331
332
  static {
332
333
  this.ɵfac = i0.ɵɵngDeclareFactory({
333
334
  minVersion: "12.0.0",
334
- version: "22.2.2",
335
+ version: "22.2.3",
335
336
  ngImport: i0,
336
337
  type: AlertHelper,
337
338
  deps: [{ token: i1$1.ModalController }],
@@ -341,7 +342,7 @@ var AlertHelper = class AlertHelper {
341
342
  static {
342
343
  this.ɵprov = i0.ɵɵngDeclareInjectable({
343
344
  minVersion: "12.0.0",
344
- version: "22.2.2",
345
+ version: "22.2.3",
345
346
  ngImport: i0,
346
347
  type: AlertHelper
347
348
  });
@@ -349,7 +350,7 @@ var AlertHelper = class AlertHelper {
349
350
  };
350
351
  i0.ɵɵngDeclareClassMetadata({
351
352
  minVersion: "12.0.0",
352
- version: "22.2.2",
353
+ version: "22.2.3",
353
354
  ngImport: i0,
354
355
  type: AlertHelper,
355
356
  decorators: [{ type: Injectable }],
@@ -372,7 +373,7 @@ var CanDismissHelper = class CanDismissHelper {
372
373
  static {
373
374
  this.ɵfac = i0.ɵɵngDeclareFactory({
374
375
  minVersion: "12.0.0",
375
- version: "22.2.2",
376
+ version: "22.2.3",
376
377
  ngImport: i0,
377
378
  type: CanDismissHelper,
378
379
  deps: [{ token: AlertHelper }],
@@ -382,7 +383,7 @@ var CanDismissHelper = class CanDismissHelper {
382
383
  static {
383
384
  this.ɵprov = i0.ɵɵngDeclareInjectable({
384
385
  minVersion: "12.0.0",
385
- version: "22.2.2",
386
+ version: "22.2.3",
386
387
  ngImport: i0,
387
388
  type: CanDismissHelper
388
389
  });
@@ -390,7 +391,7 @@ var CanDismissHelper = class CanDismissHelper {
390
391
  };
391
392
  i0.ɵɵngDeclareClassMetadata({
392
393
  minVersion: "12.0.0",
393
- version: "22.2.2",
394
+ version: "22.2.3",
394
395
  ngImport: i0,
395
396
  type: CanDismissHelper,
396
397
  decorators: [{ type: Injectable }],
@@ -773,7 +774,7 @@ var ModalWrapperComponent = class ModalWrapperComponent {
773
774
  static {
774
775
  this.ɵfac = i0.ɵɵngDeclareFactory({
775
776
  minVersion: "12.0.0",
776
- version: "22.2.2",
777
+ version: "22.2.3",
777
778
  ngImport: i0,
778
779
  type: ModalWrapperComponent,
779
780
  deps: [
@@ -795,7 +796,7 @@ var ModalWrapperComponent = class ModalWrapperComponent {
795
796
  static {
796
797
  this.ɵcmp = i0.ɵɵngDeclareComponent({
797
798
  minVersion: "17.0.0",
798
- version: "22.2.2",
799
+ version: "22.2.3",
799
800
  type: ModalWrapperComponent,
800
801
  isStandalone: true,
801
802
  selector: "kirby-modal-wrapper",
@@ -895,7 +896,7 @@ var ModalWrapperComponent = class ModalWrapperComponent {
895
896
  ],
896
897
  ngImport: i0,
897
898
  template: "<ion-header\n role=\"presentation\"\n [class.content-scrolled]=\"isContentScrolled\"\n (touchstart)=\"onHeaderTouchStart($event)\"\n>\n <ion-toolbar>\n <ion-title role=\"heading\" aria-level=\"2\" tabindex=\"-1\"></ion-title>\n @if (config.flavor === 'drawer' && config.drawerSupplementaryAction) {\n <ion-buttons slot=\"secondary\">\n <button\n kirby-button\n attentionLevel=\"3\"\n size=\"md\"\n (click)=\"config.drawerSupplementaryAction.action($event)\"\n >\n <kirby-icon [name]=\"config.drawerSupplementaryAction.iconName\"></kirby-icon>\n </button>\n </ion-buttons>\n }\n <ion-buttons slot=\"primary\">\n <button\n kirby-button\n attentionLevel=\"3\"\n size=\"md\"\n [noDecoration]=\"config.interactWithBackground\"\n [attr.aria-label]=\"translations.get('close')\"\n (click)=\"close()\"\n >\n <kirby-icon name=\"close\"></kirby-icon>\n </button>\n </ion-buttons>\n </ion-toolbar>\n</ion-header>\n\n<ion-content [scrollEvents]=\"scrollEventsEnabled\">\n @if (_hasCollapsibleTitle) {\n <ion-header collapse=\"condense\">\n <ion-toolbar>\n <span class=\"kirby-text-xlarge\" #contentTitle></span>\n </ion-toolbar>\n </ion-header>\n }\n\n <!-- Outlet for ModalController -->\n <ng-container\n *ngComponentOutlet=\"config.component; injector: componentPropsInjector\"\n ></ng-container>\n\n <!-- Outlet for projected content -->\n <ng-container *ngTemplateOutlet=\"content; injector: modalWrapperInjector\"></ng-container>\n\n <!-- Outlet for route-based modal -->\n <router-outlet\n name=\"kirbyModalWrapperOutlet\"\n [style.visibility]=\"config.modalRoute ? 'visible' : 'hidden'\"\n ></router-outlet>\n</ion-content>\n",
898
- styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}ion-header{box-sizing:border-box}ion-header ion-toolbar{--padding-start: var(--kirby-spacing-xxs);--padding-end: var(--kirby-spacing-xxs);--padding-bottom: calc(var(--kirby-spacing-xxs) - 1px);--padding-top: var(--kirby-spacing-xxs);--border-width: 0;--background: transparent;--color: var(--kirby-modal-color, var(--kirby-color-content-base));border-bottom:1px solid transparent;transition:border-color var(--kirby-transition-duration-quick) linear}@media(min-width:768px){ion-header ion-toolbar{--padding-start: var(--kirby-spacing-m);--padding-end: var(--kirby-spacing-m);--padding-bottom: calc(var(--kirby-spacing-m) - 1px);--padding-top: var(--kirby-spacing-m);padding-inline:0}}ion-header ion-toolbar button{color:var(--color)}:host{--vh100: var(--vh, 1vh) * 100;--header-height: 0px;--footer-height: 0px;--kirby-modal-safe-area-bottom: var(--ion-safe-area-bottom)}@media(max-width:767px){:host.drawer ion-header ion-toolbar{--padding-top: var(--kirby-spacing-s)}:host.drawer ion-header ion-toolbar:first-of-type{padding-top:0}}@media(min-width:768px){ion-header ion-toolbar{border-bottom-color:var(--kirby-color-border-base-silent)}}ion-header.content-scrolled ion-toolbar{border-bottom-color:var(--kirby-color-border-base-silent)}:host-context(ion-modal.no-header-area-border) ion-header ion-toolbar{border-bottom-color:transparent}@media(max-width:767px){:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)){padding-top:0;position:relative;contain:inherit;min-height:min(var(--min-height),var(--vh100) - var(--kirby-modal-padding-top, 0px))}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)) ion-content{contain:content;max-height:calc(var(--vh100) - var(--kirby-modal-padding-top, 0px) - var(--header-height) - var(--footer-height))}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)) ion-content::part(scroll){height:\"100%\";position:relative}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)).drawer ion-content::part(scroll){transition:padding-bottom .15s ease-out}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)).drawer.keyboard-visible ion-content::part(scroll){transition:padding-bottom .25s ease-out 1ms}}:host-context(ion-modal.kirby-drawer.interact-with-background){padding-top:0;position:relative;contain:inherit;min-height:min(var(--min-height),var(--vh100) - var(--kirby-modal-padding-top, 0px))}:host-context(ion-modal.kirby-drawer.interact-with-background) ion-content{contain:content;max-height:calc(var(--vh100) - var(--kirby-modal-padding-top, 0px) - var(--header-height) - var(--footer-height))}:host-context(ion-modal.kirby-drawer.interact-with-background) ion-content::part(scroll){height:\"100%\";position:relative}:host-context(ion-modal.kirby-drawer.interact-with-background).drawer ion-content::part(scroll){transition:padding-bottom .15s ease-out}:host-context(ion-modal.kirby-drawer.interact-with-background).drawer.keyboard-visible ion-content::part(scroll){transition:padding-bottom .25s ease-out 1ms}:host-context(ion-modal.kirby-drawer.interact-with-background) ion-header ion-toolbar{border-bottom-color:transparent}:host-context(ion-modal.modal-card:not(.kirby-drawer)) ion-header ion-toolbar:first-of-type{padding-top:var(--kirby-safe-area-top, 0)}@media(min-width:768px){:host-context(ion-modal.modal-card:not(.kirby-drawer)) ion-header ion-toolbar:first-of-type{--padding-start: var(--kirby-spacing-m);--padding-end: var(--kirby-spacing-m);--padding-bottom: calc(var(--kirby-spacing-m) - 1px);--padding-top: var(--kirby-spacing-m);padding-inline:0}}ion-title{box-sizing:border-box;padding-inline:calc(48px + var(--padding-start)) calc(48px + var(--padding-end));font-size:min(var(--kirby-font-size-n),19.2px);font-weight:var(--kirby-font-weight-bold);outline:none}ion-content{--background: transparent;--color: var(--kirby-modal-color, var(--kirby-color-content-base));--padding-top: var(--kirby-spacing-m);--padding-bottom: calc(var(--kirby-spacing-m) + var(--kirby-modal-safe-area-bottom));--padding-start: var(--kirby-spacing-s);--padding-end: var(--kirby-spacing-s);display:flex;flex-direction:column;height:calc(var(--height) - var(--header-height) - var(--footer-height));max-height:calc(var(--max-height) - var(--header-height) - var(--footer-height))}ion-content ::ng-deep>*{box-sizing:border-box;display:block}:host(:has(kirby-modal-footer)) ion-content{--padding-bottom: var(--kirby-spacing-m)}:host(.keyboard-visible) ion-content{--padding-bottom: calc( var(--kirby-spacing-m) + var(--kirby-keyboard-content-overlap, 0px) - var(--keyboard-offset, 0px) )}@media(min-width:768px){ion-content{--padding-start: var(--kirby-spacing-xxl);--padding-end: var(--kirby-spacing-xxl)}}:host(.collapsible-title) ion-content ion-toolbar:first-of-type{--padding-top: 0px;--padding-bottom: var(--kirby-spacing-l);--padding-start: var(--kirby-spacing-xxs);--padding-end: var(--kirby-spacing-xxs);border:none}@media(min-width:768px){:host(.collapsible-title) ion-content ion-toolbar:first-of-type{--padding-start: var(--kirby-spacing-s);--padding-end: var(--kirby-spacing-s)}}\n"],
899
+ styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}ion-header{box-sizing:border-box}ion-header ion-toolbar{--padding-start: var(--kirby-spacing-xxs);--padding-end: var(--kirby-spacing-xxs);--padding-bottom: calc(var(--kirby-spacing-xxs) - var(--kirby-stroke-xs));--padding-top: var(--kirby-spacing-xxs);--border-width: 0;--background: transparent;--color: var(--kirby-modal-color, var(--kirby-color-content-base));border-bottom:var(--kirby-stroke-xs) solid transparent;transition:border-color var(--kirby-transition-duration-quick) linear}@media(min-width:768px){ion-header ion-toolbar{--padding-start: var(--kirby-spacing-m);--padding-end: var(--kirby-spacing-m);--padding-bottom: calc(var(--kirby-spacing-m) - var(--kirby-stroke-xs));--padding-top: var(--kirby-spacing-m);padding-inline:0}}ion-header ion-toolbar button{color:var(--color)}:host{--vh100: var(--vh, 1vh) * 100;--header-height: 0px;--footer-height: 0px;--kirby-modal-safe-area-bottom: var(--ion-safe-area-bottom)}@media(max-width:767px){:host.drawer ion-header ion-toolbar{--padding-top: var(--kirby-spacing-s)}:host.drawer ion-header ion-toolbar:first-of-type{padding-top:0}}@media(min-width:768px){ion-header ion-toolbar{border-bottom-color:var(--kirby-color-border-base-silent)}}ion-header.content-scrolled ion-toolbar{border-bottom-color:var(--kirby-color-border-base-silent)}:host-context(ion-modal.no-header-area-border) ion-header ion-toolbar{border-bottom-color:transparent}@media(max-width:767px){:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)){padding-top:0;position:relative;contain:inherit;min-height:min(var(--min-height),var(--vh100) - var(--kirby-modal-padding-top, 0px))}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)) ion-content{contain:content;max-height:calc(var(--vh100) - var(--kirby-modal-padding-top, 0px) - var(--header-height) - var(--footer-height))}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)) ion-content::part(scroll){height:\"100%\";position:relative}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)).drawer ion-content::part(scroll){transition:padding-bottom var(--kirby-transition-soft-keyboard-leave)}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)).drawer.keyboard-visible ion-content::part(scroll){transition:padding-bottom var(--kirby-transition-soft-keyboard-enter)}}:host-context(ion-modal.kirby-drawer.interact-with-background){padding-top:0;position:relative;contain:inherit;min-height:min(var(--min-height),var(--vh100) - var(--kirby-modal-padding-top, 0px))}:host-context(ion-modal.kirby-drawer.interact-with-background) ion-content{contain:content;max-height:calc(var(--vh100) - var(--kirby-modal-padding-top, 0px) - var(--header-height) - var(--footer-height))}:host-context(ion-modal.kirby-drawer.interact-with-background) ion-content::part(scroll){height:\"100%\";position:relative}:host-context(ion-modal.kirby-drawer.interact-with-background).drawer ion-content::part(scroll){transition:padding-bottom var(--kirby-transition-soft-keyboard-leave)}:host-context(ion-modal.kirby-drawer.interact-with-background).drawer.keyboard-visible ion-content::part(scroll){transition:padding-bottom var(--kirby-transition-soft-keyboard-enter)}:host-context(ion-modal.kirby-drawer.interact-with-background) ion-header ion-toolbar{border-bottom-color:transparent}:host-context(ion-modal.modal-card:not(.kirby-drawer)) ion-header ion-toolbar:first-of-type{padding-top:var(--kirby-safe-area-top, 0)}@media(min-width:768px){:host-context(ion-modal.modal-card:not(.kirby-drawer)) ion-header ion-toolbar:first-of-type{--padding-start: var(--kirby-spacing-m);--padding-end: var(--kirby-spacing-m);--padding-bottom: calc(var(--kirby-spacing-m) - var(--kirby-stroke-xs));--padding-top: var(--kirby-spacing-m);padding-inline:0}}ion-title{box-sizing:border-box;padding-inline:calc(48px + var(--padding-start)) calc(48px + var(--padding-end));font-size:min(var(--kirby-font-size-n),19.2px);font-weight:var(--kirby-font-weight-bold);outline:none}ion-content{--background: transparent;--color: var(--kirby-modal-color, var(--kirby-color-content-base));--padding-top: var(--kirby-spacing-m);--padding-bottom: calc(var(--kirby-spacing-m) + var(--kirby-modal-safe-area-bottom));--padding-start: var(--kirby-spacing-s);--padding-end: var(--kirby-spacing-s);display:flex;flex-direction:column;height:calc(var(--height) - var(--header-height) - var(--footer-height));max-height:calc(var(--max-height) - var(--header-height) - var(--footer-height))}ion-content ::ng-deep>*{box-sizing:border-box;display:block}:host(:has(kirby-modal-footer)) ion-content{--padding-bottom: var(--kirby-spacing-m)}:host(.keyboard-visible) ion-content{--padding-bottom: calc( var(--kirby-spacing-m) + var(--kirby-keyboard-content-overlap, 0px) - var(--keyboard-offset, 0px) )}@media(min-width:768px){ion-content{--padding-start: var(--kirby-spacing-xxl);--padding-end: var(--kirby-spacing-xxl)}}:host(.collapsible-title) ion-content ion-toolbar:first-of-type{--padding-top: 0px;--padding-bottom: var(--kirby-spacing-l);--padding-start: var(--kirby-spacing-xxs);--padding-end: var(--kirby-spacing-xxs);border:none}@media(min-width:768px){:host(.collapsible-title) ion-content ion-toolbar:first-of-type{--padding-start: var(--kirby-spacing-s);--padding-end: var(--kirby-spacing-s)}}\n"],
899
900
  dependencies: [
900
901
  {
901
902
  kind: "ngmodule",
@@ -1016,7 +1017,7 @@ var ModalWrapperComponent = class ModalWrapperComponent {
1016
1017
  };
1017
1018
  i0.ɵɵngDeclareClassMetadata({
1018
1019
  minVersion: "12.0.0",
1019
- version: "22.2.2",
1020
+ version: "22.2.3",
1020
1021
  ngImport: i0,
1021
1022
  type: ModalWrapperComponent,
1022
1023
  decorators: [{
@@ -1043,7 +1044,7 @@ i0.ɵɵngDeclareClassMetadata({
1043
1044
  useExisting: ModalWrapperComponent
1044
1045
  }],
1045
1046
  template: "<ion-header\n role=\"presentation\"\n [class.content-scrolled]=\"isContentScrolled\"\n (touchstart)=\"onHeaderTouchStart($event)\"\n>\n <ion-toolbar>\n <ion-title role=\"heading\" aria-level=\"2\" tabindex=\"-1\"></ion-title>\n @if (config.flavor === 'drawer' && config.drawerSupplementaryAction) {\n <ion-buttons slot=\"secondary\">\n <button\n kirby-button\n attentionLevel=\"3\"\n size=\"md\"\n (click)=\"config.drawerSupplementaryAction.action($event)\"\n >\n <kirby-icon [name]=\"config.drawerSupplementaryAction.iconName\"></kirby-icon>\n </button>\n </ion-buttons>\n }\n <ion-buttons slot=\"primary\">\n <button\n kirby-button\n attentionLevel=\"3\"\n size=\"md\"\n [noDecoration]=\"config.interactWithBackground\"\n [attr.aria-label]=\"translations.get('close')\"\n (click)=\"close()\"\n >\n <kirby-icon name=\"close\"></kirby-icon>\n </button>\n </ion-buttons>\n </ion-toolbar>\n</ion-header>\n\n<ion-content [scrollEvents]=\"scrollEventsEnabled\">\n @if (_hasCollapsibleTitle) {\n <ion-header collapse=\"condense\">\n <ion-toolbar>\n <span class=\"kirby-text-xlarge\" #contentTitle></span>\n </ion-toolbar>\n </ion-header>\n }\n\n <!-- Outlet for ModalController -->\n <ng-container\n *ngComponentOutlet=\"config.component; injector: componentPropsInjector\"\n ></ng-container>\n\n <!-- Outlet for projected content -->\n <ng-container *ngTemplateOutlet=\"content; injector: modalWrapperInjector\"></ng-container>\n\n <!-- Outlet for route-based modal -->\n <router-outlet\n name=\"kirbyModalWrapperOutlet\"\n [style.visibility]=\"config.modalRoute ? 'visible' : 'hidden'\"\n ></router-outlet>\n</ion-content>\n",
1046
- styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}ion-header{box-sizing:border-box}ion-header ion-toolbar{--padding-start: var(--kirby-spacing-xxs);--padding-end: var(--kirby-spacing-xxs);--padding-bottom: calc(var(--kirby-spacing-xxs) - 1px);--padding-top: var(--kirby-spacing-xxs);--border-width: 0;--background: transparent;--color: var(--kirby-modal-color, var(--kirby-color-content-base));border-bottom:1px solid transparent;transition:border-color var(--kirby-transition-duration-quick) linear}@media(min-width:768px){ion-header ion-toolbar{--padding-start: var(--kirby-spacing-m);--padding-end: var(--kirby-spacing-m);--padding-bottom: calc(var(--kirby-spacing-m) - 1px);--padding-top: var(--kirby-spacing-m);padding-inline:0}}ion-header ion-toolbar button{color:var(--color)}:host{--vh100: var(--vh, 1vh) * 100;--header-height: 0px;--footer-height: 0px;--kirby-modal-safe-area-bottom: var(--ion-safe-area-bottom)}@media(max-width:767px){:host.drawer ion-header ion-toolbar{--padding-top: var(--kirby-spacing-s)}:host.drawer ion-header ion-toolbar:first-of-type{padding-top:0}}@media(min-width:768px){ion-header ion-toolbar{border-bottom-color:var(--kirby-color-border-base-silent)}}ion-header.content-scrolled ion-toolbar{border-bottom-color:var(--kirby-color-border-base-silent)}:host-context(ion-modal.no-header-area-border) ion-header ion-toolbar{border-bottom-color:transparent}@media(max-width:767px){:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)){padding-top:0;position:relative;contain:inherit;min-height:min(var(--min-height),var(--vh100) - var(--kirby-modal-padding-top, 0px))}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)) ion-content{contain:content;max-height:calc(var(--vh100) - var(--kirby-modal-padding-top, 0px) - var(--header-height) - var(--footer-height))}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)) ion-content::part(scroll){height:\"100%\";position:relative}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)).drawer ion-content::part(scroll){transition:padding-bottom .15s ease-out}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)).drawer.keyboard-visible ion-content::part(scroll){transition:padding-bottom .25s ease-out 1ms}}:host-context(ion-modal.kirby-drawer.interact-with-background){padding-top:0;position:relative;contain:inherit;min-height:min(var(--min-height),var(--vh100) - var(--kirby-modal-padding-top, 0px))}:host-context(ion-modal.kirby-drawer.interact-with-background) ion-content{contain:content;max-height:calc(var(--vh100) - var(--kirby-modal-padding-top, 0px) - var(--header-height) - var(--footer-height))}:host-context(ion-modal.kirby-drawer.interact-with-background) ion-content::part(scroll){height:\"100%\";position:relative}:host-context(ion-modal.kirby-drawer.interact-with-background).drawer ion-content::part(scroll){transition:padding-bottom .15s ease-out}:host-context(ion-modal.kirby-drawer.interact-with-background).drawer.keyboard-visible ion-content::part(scroll){transition:padding-bottom .25s ease-out 1ms}:host-context(ion-modal.kirby-drawer.interact-with-background) ion-header ion-toolbar{border-bottom-color:transparent}:host-context(ion-modal.modal-card:not(.kirby-drawer)) ion-header ion-toolbar:first-of-type{padding-top:var(--kirby-safe-area-top, 0)}@media(min-width:768px){:host-context(ion-modal.modal-card:not(.kirby-drawer)) ion-header ion-toolbar:first-of-type{--padding-start: var(--kirby-spacing-m);--padding-end: var(--kirby-spacing-m);--padding-bottom: calc(var(--kirby-spacing-m) - 1px);--padding-top: var(--kirby-spacing-m);padding-inline:0}}ion-title{box-sizing:border-box;padding-inline:calc(48px + var(--padding-start)) calc(48px + var(--padding-end));font-size:min(var(--kirby-font-size-n),19.2px);font-weight:var(--kirby-font-weight-bold);outline:none}ion-content{--background: transparent;--color: var(--kirby-modal-color, var(--kirby-color-content-base));--padding-top: var(--kirby-spacing-m);--padding-bottom: calc(var(--kirby-spacing-m) + var(--kirby-modal-safe-area-bottom));--padding-start: var(--kirby-spacing-s);--padding-end: var(--kirby-spacing-s);display:flex;flex-direction:column;height:calc(var(--height) - var(--header-height) - var(--footer-height));max-height:calc(var(--max-height) - var(--header-height) - var(--footer-height))}ion-content ::ng-deep>*{box-sizing:border-box;display:block}:host(:has(kirby-modal-footer)) ion-content{--padding-bottom: var(--kirby-spacing-m)}:host(.keyboard-visible) ion-content{--padding-bottom: calc( var(--kirby-spacing-m) + var(--kirby-keyboard-content-overlap, 0px) - var(--keyboard-offset, 0px) )}@media(min-width:768px){ion-content{--padding-start: var(--kirby-spacing-xxl);--padding-end: var(--kirby-spacing-xxl)}}:host(.collapsible-title) ion-content ion-toolbar:first-of-type{--padding-top: 0px;--padding-bottom: var(--kirby-spacing-l);--padding-start: var(--kirby-spacing-xxs);--padding-end: var(--kirby-spacing-xxs);border:none}@media(min-width:768px){:host(.collapsible-title) ion-content ion-toolbar:first-of-type{--padding-start: var(--kirby-spacing-s);--padding-end: var(--kirby-spacing-s)}}\n"]
1047
+ styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}ion-header{box-sizing:border-box}ion-header ion-toolbar{--padding-start: var(--kirby-spacing-xxs);--padding-end: var(--kirby-spacing-xxs);--padding-bottom: calc(var(--kirby-spacing-xxs) - var(--kirby-stroke-xs));--padding-top: var(--kirby-spacing-xxs);--border-width: 0;--background: transparent;--color: var(--kirby-modal-color, var(--kirby-color-content-base));border-bottom:var(--kirby-stroke-xs) solid transparent;transition:border-color var(--kirby-transition-duration-quick) linear}@media(min-width:768px){ion-header ion-toolbar{--padding-start: var(--kirby-spacing-m);--padding-end: var(--kirby-spacing-m);--padding-bottom: calc(var(--kirby-spacing-m) - var(--kirby-stroke-xs));--padding-top: var(--kirby-spacing-m);padding-inline:0}}ion-header ion-toolbar button{color:var(--color)}:host{--vh100: var(--vh, 1vh) * 100;--header-height: 0px;--footer-height: 0px;--kirby-modal-safe-area-bottom: var(--ion-safe-area-bottom)}@media(max-width:767px){:host.drawer ion-header ion-toolbar{--padding-top: var(--kirby-spacing-s)}:host.drawer ion-header ion-toolbar:first-of-type{padding-top:0}}@media(min-width:768px){ion-header ion-toolbar{border-bottom-color:var(--kirby-color-border-base-silent)}}ion-header.content-scrolled ion-toolbar{border-bottom-color:var(--kirby-color-border-base-silent)}:host-context(ion-modal.no-header-area-border) ion-header ion-toolbar{border-bottom-color:transparent}@media(max-width:767px){:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)){padding-top:0;position:relative;contain:inherit;min-height:min(var(--min-height),var(--vh100) - var(--kirby-modal-padding-top, 0px))}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)) ion-content{contain:content;max-height:calc(var(--vh100) - var(--kirby-modal-padding-top, 0px) - var(--header-height) - var(--footer-height))}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)) ion-content::part(scroll){height:\"100%\";position:relative}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)).drawer ion-content::part(scroll){transition:padding-bottom var(--kirby-transition-soft-keyboard-leave)}:host-context(ion-modal.kirby-drawer:not(.kirby-modal-full-height)).drawer.keyboard-visible ion-content::part(scroll){transition:padding-bottom var(--kirby-transition-soft-keyboard-enter)}}:host-context(ion-modal.kirby-drawer.interact-with-background){padding-top:0;position:relative;contain:inherit;min-height:min(var(--min-height),var(--vh100) - var(--kirby-modal-padding-top, 0px))}:host-context(ion-modal.kirby-drawer.interact-with-background) ion-content{contain:content;max-height:calc(var(--vh100) - var(--kirby-modal-padding-top, 0px) - var(--header-height) - var(--footer-height))}:host-context(ion-modal.kirby-drawer.interact-with-background) ion-content::part(scroll){height:\"100%\";position:relative}:host-context(ion-modal.kirby-drawer.interact-with-background).drawer ion-content::part(scroll){transition:padding-bottom var(--kirby-transition-soft-keyboard-leave)}:host-context(ion-modal.kirby-drawer.interact-with-background).drawer.keyboard-visible ion-content::part(scroll){transition:padding-bottom var(--kirby-transition-soft-keyboard-enter)}:host-context(ion-modal.kirby-drawer.interact-with-background) ion-header ion-toolbar{border-bottom-color:transparent}:host-context(ion-modal.modal-card:not(.kirby-drawer)) ion-header ion-toolbar:first-of-type{padding-top:var(--kirby-safe-area-top, 0)}@media(min-width:768px){:host-context(ion-modal.modal-card:not(.kirby-drawer)) ion-header ion-toolbar:first-of-type{--padding-start: var(--kirby-spacing-m);--padding-end: var(--kirby-spacing-m);--padding-bottom: calc(var(--kirby-spacing-m) - var(--kirby-stroke-xs));--padding-top: var(--kirby-spacing-m);padding-inline:0}}ion-title{box-sizing:border-box;padding-inline:calc(48px + var(--padding-start)) calc(48px + var(--padding-end));font-size:min(var(--kirby-font-size-n),19.2px);font-weight:var(--kirby-font-weight-bold);outline:none}ion-content{--background: transparent;--color: var(--kirby-modal-color, var(--kirby-color-content-base));--padding-top: var(--kirby-spacing-m);--padding-bottom: calc(var(--kirby-spacing-m) + var(--kirby-modal-safe-area-bottom));--padding-start: var(--kirby-spacing-s);--padding-end: var(--kirby-spacing-s);display:flex;flex-direction:column;height:calc(var(--height) - var(--header-height) - var(--footer-height));max-height:calc(var(--max-height) - var(--header-height) - var(--footer-height))}ion-content ::ng-deep>*{box-sizing:border-box;display:block}:host(:has(kirby-modal-footer)) ion-content{--padding-bottom: var(--kirby-spacing-m)}:host(.keyboard-visible) ion-content{--padding-bottom: calc( var(--kirby-spacing-m) + var(--kirby-keyboard-content-overlap, 0px) - var(--keyboard-offset, 0px) )}@media(min-width:768px){ion-content{--padding-start: var(--kirby-spacing-xxl);--padding-end: var(--kirby-spacing-xxl)}}:host(.collapsible-title) ion-content ion-toolbar:first-of-type{--padding-top: 0px;--padding-bottom: var(--kirby-spacing-l);--padding-start: var(--kirby-spacing-xxs);--padding-end: var(--kirby-spacing-xxs);border:none}@media(min-width:768px){:host(.collapsible-title) ion-content ion-toolbar:first-of-type{--padding-start: var(--kirby-spacing-s);--padding-end: var(--kirby-spacing-s)}}\n"]
1047
1048
  }]
1048
1049
  }],
1049
1050
  ctorParameters: () => [
@@ -1203,7 +1204,7 @@ var ModalCompactWrapperComponent = class ModalCompactWrapperComponent {
1203
1204
  static {
1204
1205
  this.ɵfac = i0.ɵɵngDeclareFactory({
1205
1206
  minVersion: "12.0.0",
1206
- version: "22.2.2",
1207
+ version: "22.2.3",
1207
1208
  ngImport: i0,
1208
1209
  type: ModalCompactWrapperComponent,
1209
1210
  deps: [
@@ -1219,7 +1220,7 @@ var ModalCompactWrapperComponent = class ModalCompactWrapperComponent {
1219
1220
  static {
1220
1221
  this.ɵcmp = i0.ɵɵngDeclareComponent({
1221
1222
  minVersion: "14.0.0",
1222
- version: "22.2.2",
1223
+ version: "22.2.3",
1223
1224
  type: ModalCompactWrapperComponent,
1224
1225
  isStandalone: true,
1225
1226
  selector: "kirby-modal-compact-wrapper",
@@ -1277,7 +1278,7 @@ var ModalCompactWrapperComponent = class ModalCompactWrapperComponent {
1277
1278
  };
1278
1279
  i0.ɵɵngDeclareClassMetadata({
1279
1280
  minVersion: "12.0.0",
1280
- version: "22.2.2",
1281
+ version: "22.2.3",
1281
1282
  ngImport: i0,
1282
1283
  type: ModalCompactWrapperComponent,
1283
1284
  decorators: [{
@@ -1478,7 +1479,7 @@ var ModalAnimationBuilderService = class ModalAnimationBuilderService {
1478
1479
  static {
1479
1480
  this.ɵfac = i0.ɵɵngDeclareFactory({
1480
1481
  minVersion: "12.0.0",
1481
- version: "22.2.2",
1482
+ version: "22.2.3",
1482
1483
  ngImport: i0,
1483
1484
  type: ModalAnimationBuilderService,
1484
1485
  deps: [{ token: i3.PlatformService }],
@@ -1488,7 +1489,7 @@ var ModalAnimationBuilderService = class ModalAnimationBuilderService {
1488
1489
  static {
1489
1490
  this.ɵprov = i0.ɵɵngDeclareInjectable({
1490
1491
  minVersion: "12.0.0",
1491
- version: "22.2.2",
1492
+ version: "22.2.3",
1492
1493
  ngImport: i0,
1493
1494
  type: ModalAnimationBuilderService,
1494
1495
  providedIn: "root"
@@ -1497,7 +1498,7 @@ var ModalAnimationBuilderService = class ModalAnimationBuilderService {
1497
1498
  };
1498
1499
  i0.ɵɵngDeclareClassMetadata({
1499
1500
  minVersion: "12.0.0",
1500
- version: "22.2.2",
1501
+ version: "22.2.3",
1501
1502
  ngImport: i0,
1502
1503
  type: ModalAnimationBuilderService,
1503
1504
  decorators: [{
@@ -1698,7 +1699,7 @@ var ModalNavigationService = class ModalNavigationService {
1698
1699
  static {
1699
1700
  this.ɵfac = i0.ɵɵngDeclareFactory({
1700
1701
  minVersion: "12.0.0",
1701
- version: "22.2.2",
1702
+ version: "22.2.3",
1702
1703
  ngImport: i0,
1703
1704
  type: ModalNavigationService,
1704
1705
  deps: [{ token: i5.Router }, { token: i5.ActivatedRoute }],
@@ -1708,7 +1709,7 @@ var ModalNavigationService = class ModalNavigationService {
1708
1709
  static {
1709
1710
  this.ɵprov = i0.ɵɵngDeclareInjectable({
1710
1711
  minVersion: "12.0.0",
1711
- version: "22.2.2",
1712
+ version: "22.2.3",
1712
1713
  ngImport: i0,
1713
1714
  type: ModalNavigationService,
1714
1715
  providedIn: "root"
@@ -1717,7 +1718,7 @@ var ModalNavigationService = class ModalNavigationService {
1717
1718
  };
1718
1719
  i0.ɵɵngDeclareClassMetadata({
1719
1720
  minVersion: "12.0.0",
1720
- version: "22.2.2",
1721
+ version: "22.2.3",
1721
1722
  ngImport: i0,
1722
1723
  type: ModalNavigationService,
1723
1724
  decorators: [{
@@ -1795,7 +1796,7 @@ var ModalHelper = class ModalHelper {
1795
1796
  static {
1796
1797
  this.ɵfac = i0.ɵɵngDeclareFactory({
1797
1798
  minVersion: "12.0.0",
1798
- version: "22.2.2",
1799
+ version: "22.2.3",
1799
1800
  ngImport: i0,
1800
1801
  type: ModalHelper,
1801
1802
  deps: [
@@ -1811,7 +1812,7 @@ var ModalHelper = class ModalHelper {
1811
1812
  static {
1812
1813
  this.ɵprov = i0.ɵɵngDeclareInjectable({
1813
1814
  minVersion: "12.0.0",
1814
- version: "22.2.2",
1815
+ version: "22.2.3",
1815
1816
  ngImport: i0,
1816
1817
  type: ModalHelper
1817
1818
  });
@@ -1819,7 +1820,7 @@ var ModalHelper = class ModalHelper {
1819
1820
  };
1820
1821
  i0.ɵɵngDeclareClassMetadata({
1821
1822
  minVersion: "12.0.0",
1822
- version: "22.2.2",
1823
+ version: "22.2.3",
1823
1824
  ngImport: i0,
1824
1825
  type: ModalHelper,
1825
1826
  decorators: [{ type: Injectable }],
@@ -1850,7 +1851,7 @@ var ActionSheetComponent = class ActionSheetComponent {
1850
1851
  static {
1851
1852
  this.ɵfac = i0.ɵɵngDeclareFactory({
1852
1853
  minVersion: "12.0.0",
1853
- version: "22.2.2",
1854
+ version: "22.2.3",
1854
1855
  ngImport: i0,
1855
1856
  type: ActionSheetComponent,
1856
1857
  deps: [],
@@ -1860,7 +1861,7 @@ var ActionSheetComponent = class ActionSheetComponent {
1860
1861
  static {
1861
1862
  this.ɵcmp = i0.ɵɵngDeclareComponent({
1862
1863
  minVersion: "17.0.0",
1863
- version: "22.2.2",
1864
+ version: "22.2.3",
1864
1865
  type: ActionSheetComponent,
1865
1866
  isStandalone: true,
1866
1867
  selector: "kirby-action-sheet",
@@ -1926,7 +1927,7 @@ var ActionSheetComponent = class ActionSheetComponent {
1926
1927
  };
1927
1928
  i0.ɵɵngDeclareClassMetadata({
1928
1929
  minVersion: "12.0.0",
1929
- version: "22.2.2",
1930
+ version: "22.2.3",
1930
1931
  ngImport: i0,
1931
1932
  type: ActionSheetComponent,
1932
1933
  decorators: [{
@@ -1989,7 +1990,7 @@ var ActionSheetHelper = class ActionSheetHelper {
1989
1990
  static {
1990
1991
  this.ɵfac = i0.ɵɵngDeclareFactory({
1991
1992
  minVersion: "12.0.0",
1992
- version: "22.2.2",
1993
+ version: "22.2.3",
1993
1994
  ngImport: i0,
1994
1995
  type: ActionSheetHelper,
1995
1996
  deps: [{ token: i1$1.ModalController }],
@@ -1999,7 +2000,7 @@ var ActionSheetHelper = class ActionSheetHelper {
1999
2000
  static {
2000
2001
  this.ɵprov = i0.ɵɵngDeclareInjectable({
2001
2002
  minVersion: "12.0.0",
2002
- version: "22.2.2",
2003
+ version: "22.2.3",
2003
2004
  ngImport: i0,
2004
2005
  type: ActionSheetHelper
2005
2006
  });
@@ -2007,7 +2008,7 @@ var ActionSheetHelper = class ActionSheetHelper {
2007
2008
  };
2008
2009
  i0.ɵɵngDeclareClassMetadata({
2009
2010
  minVersion: "12.0.0",
2010
- version: "22.2.2",
2011
+ version: "22.2.3",
2011
2012
  ngImport: i0,
2012
2013
  type: ActionSheetHelper,
2013
2014
  decorators: [{ type: Injectable }],
@@ -2097,7 +2098,7 @@ var ModalController = class ModalController {
2097
2098
  static {
2098
2099
  this.ɵfac = i0.ɵɵngDeclareFactory({
2099
2100
  minVersion: "12.0.0",
2100
- version: "22.2.2",
2101
+ version: "22.2.3",
2101
2102
  ngImport: i0,
2102
2103
  type: ModalController,
2103
2104
  deps: [
@@ -2116,7 +2117,7 @@ var ModalController = class ModalController {
2116
2117
  static {
2117
2118
  this.ɵprov = i0.ɵɵngDeclareInjectable({
2118
2119
  minVersion: "12.0.0",
2119
- version: "22.2.2",
2120
+ version: "22.2.3",
2120
2121
  ngImport: i0,
2121
2122
  type: ModalController
2122
2123
  });
@@ -2124,7 +2125,7 @@ var ModalController = class ModalController {
2124
2125
  };
2125
2126
  i0.ɵɵngDeclareClassMetadata({
2126
2127
  minVersion: "12.0.0",
2127
- version: "22.2.2",
2128
+ version: "22.2.3",
2128
2129
  ngImport: i0,
2129
2130
  type: ModalController,
2130
2131
  decorators: [{ type: Injectable }],
@@ -2225,7 +2226,7 @@ var ModalComponent = class ModalComponent {
2225
2226
  static {
2226
2227
  this.ɵfac = i0.ɵɵngDeclareFactory({
2227
2228
  minVersion: "12.0.0",
2228
- version: "22.2.2",
2229
+ version: "22.2.3",
2229
2230
  ngImport: i0,
2230
2231
  type: ModalComponent,
2231
2232
  deps: [
@@ -2240,7 +2241,7 @@ var ModalComponent = class ModalComponent {
2240
2241
  static {
2241
2242
  this.ɵcmp = i0.ɵɵngDeclareComponent({
2242
2243
  minVersion: "17.0.0",
2243
- version: "22.2.2",
2244
+ version: "22.2.3",
2244
2245
  type: ModalComponent,
2245
2246
  isStandalone: true,
2246
2247
  selector: "kirby-modal",
@@ -2324,7 +2325,7 @@ var ModalComponent = class ModalComponent {
2324
2325
  };
2325
2326
  i0.ɵɵngDeclareClassMetadata({
2326
2327
  minVersion: "12.0.0",
2327
- version: "22.2.2",
2328
+ version: "22.2.3",
2328
2329
  ngImport: i0,
2329
2330
  type: ModalComponent,
2330
2331
  decorators: [{
@@ -2382,7 +2383,15 @@ i0.ɵɵngDeclareClassMetadata({
2382
2383
  });
2383
2384
  var ModalFooterComponent = class ModalFooterComponent extends ModalElementComponent {
2384
2385
  get _cssClass() {
2385
- return [this.themeColor, this.type].filter((cssClass) => !!cssClass);
2386
+ return [
2387
+ this.themeColor,
2388
+ this.type,
2389
+ this.surface
2390
+ ].filter((cssClass) => !!cssClass);
2391
+ }
2392
+ get surface() {
2393
+ if (this.type === "inline") return null;
2394
+ return this.themeColor === "light" ? "kirby-surface-base" : "kirby-surface-raised";
2386
2395
  }
2387
2396
  constructor(elementRef, modalElementsAdvertiser) {
2388
2397
  super(ModalElementType.FOOTER, elementRef, modalElementsAdvertiser);
@@ -2393,7 +2402,7 @@ var ModalFooterComponent = class ModalFooterComponent extends ModalElementCompon
2393
2402
  static {
2394
2403
  this.ɵfac = i0.ɵɵngDeclareFactory({
2395
2404
  minVersion: "12.0.0",
2396
- version: "22.2.2",
2405
+ version: "22.2.3",
2397
2406
  ngImport: i0,
2398
2407
  type: ModalFooterComponent,
2399
2408
  deps: [{ token: i0.ElementRef }, {
@@ -2406,7 +2415,7 @@ var ModalFooterComponent = class ModalFooterComponent extends ModalElementCompon
2406
2415
  static {
2407
2416
  this.ɵcmp = i0.ɵɵngDeclareComponent({
2408
2417
  minVersion: "14.0.0",
2409
- version: "22.2.2",
2418
+ version: "22.2.3",
2410
2419
  type: ModalFooterComponent,
2411
2420
  isStandalone: true,
2412
2421
  selector: "kirby-modal-footer",
@@ -2422,7 +2431,7 @@ var ModalFooterComponent = class ModalFooterComponent extends ModalElementCompon
2422
2431
  usesInheritance: true,
2423
2432
  ngImport: i0,
2424
2433
  template: "<ion-footer role=\"presentation\">\n <ng-content></ng-content>\n</ion-footer>\n",
2425
- styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}ion-item-option.success{background-color:var(--kirby-color-fill-success);color:var(--kirby-color-content-success)}@media(hover:hover){ion-item-option.success:hover{background-color:var(--kirby-color-fill-success-hover);color:var(--kirby-color-content-success-hover)}}ion-item-option.success:active{background-color:var(--kirby-color-fill-success-active);color:var(--kirby-color-content-success-active)}ion-item-option.warning{background-color:var(--kirby-color-fill-warning);color:var(--kirby-color-content-warning)}@media(hover:hover){ion-item-option.warning:hover{background-color:var(--kirby-color-fill-warning-hover);color:var(--kirby-color-content-warning-hover)}}ion-item-option.warning:active{background-color:var(--kirby-color-fill-warning-active);color:var(--kirby-color-content-warning-active)}ion-item-option.danger{background-color:var(--kirby-color-fill-danger);color:var(--kirby-color-content-danger)}@media(hover:hover){ion-item-option.danger:hover{background-color:var(--kirby-color-fill-danger-hover);color:var(--kirby-color-content-danger-hover)}}ion-item-option.danger:active{background-color:var(--kirby-color-fill-danger-active);color:var(--kirby-color-content-danger-active)}ion-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);box-shadow:var(--kirby-elevation-8);box-sizing:inherit;display:flex;justify-content:var(--kirby-modal-footer-justify-content, center);align-items:center;background-color:var(--kirby-modal-footer-background, var(--kirby-color-fill-raised));color:var(--kirby-modal-footer-color, var(--kirby-color-content-raised));padding:var(--kirby-spacing-s);padding-bottom:calc(var(--kirby-spacing-xs) + var(--kirby-modal-safe-area-bottom))}@media(min-width:768px){ion-footer{padding:var(--kirby-spacing-m)}}:host{box-sizing:border-box;display:block}:host(.snap-to-keyboard) ion-footer{transition:transform var(--kirby-transition-soft-keyboard-leave)}:host(.light) ion-footer{--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);background-color:var(--kirby-background-color)}:host(.inline) ion-footer{--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);background:transparent;box-shadow:none}:host-context(.keyboard-visible).snap-to-keyboard ion-footer{transition:transform var(--kirby-transition-soft-keyboard-enter);transform:translateY(calc((var(--keyboard-offset, 0px) - var(--kirby-modal-safe-area-bottom)) * -1))}\n"],
2434
+ styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}ion-item-option.success{background-color:var(--kirby-color-fill-success);color:var(--kirby-color-content-success)}@media(hover:hover){ion-item-option.success:hover{background-color:var(--kirby-color-fill-success-hover);color:var(--kirby-color-content-success-hover)}}ion-item-option.success:active{background-color:var(--kirby-color-fill-success-active);color:var(--kirby-color-content-success-active)}ion-item-option.warning{background-color:var(--kirby-color-fill-warning);color:var(--kirby-color-content-warning)}@media(hover:hover){ion-item-option.warning:hover{background-color:var(--kirby-color-fill-warning-hover);color:var(--kirby-color-content-warning-hover)}}ion-item-option.warning:active{background-color:var(--kirby-color-fill-warning-active);color:var(--kirby-color-content-warning-active)}ion-item-option.danger{background-color:var(--kirby-color-fill-danger);color:var(--kirby-color-content-danger)}@media(hover:hover){ion-item-option.danger:hover{background-color:var(--kirby-color-fill-danger-hover);color:var(--kirby-color-content-danger-hover)}}ion-item-option.danger:active{background-color:var(--kirby-color-fill-danger-active);color:var(--kirby-color-content-danger-active)}ion-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);box-shadow:var(--kirby-elevation-8);box-sizing:inherit;display:flex;justify-content:var(--kirby-modal-footer-justify-content, center);align-items:center;background-color:var(--kirby-modal-footer-background, var(--kirby-color-fill-base));color:var(--kirby-modal-footer-color, var(--kirby-color-content-base));padding:var(--kirby-spacing-s);padding-bottom:calc(var(--kirby-spacing-xs) + var(--kirby-modal-safe-area-bottom))}@media(min-width:768px){ion-footer{padding:var(--kirby-spacing-m)}}:host{box-sizing:border-box;display:block}:host(.snap-to-keyboard) ion-footer{transition:transform var(--kirby-transition-soft-keyboard-leave)}:host(.light) ion-footer{--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)}:host(.inline) ion-footer{--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);background:transparent;box-shadow:none}:host-context(.keyboard-visible).snap-to-keyboard ion-footer{transition:transform var(--kirby-transition-soft-keyboard-enter);transform:translateY(calc((var(--keyboard-offset, 0px) - var(--kirby-modal-safe-area-bottom)) * -1))}\n"],
2426
2435
  dependencies: [{
2427
2436
  kind: "component",
2428
2437
  type: IonFooter,
@@ -2439,7 +2448,7 @@ var ModalFooterComponent = class ModalFooterComponent extends ModalElementCompon
2439
2448
  };
2440
2449
  i0.ɵɵngDeclareClassMetadata({
2441
2450
  minVersion: "12.0.0",
2442
- version: "22.2.2",
2451
+ version: "22.2.3",
2443
2452
  ngImport: i0,
2444
2453
  type: ModalFooterComponent,
2445
2454
  decorators: [{
@@ -2449,7 +2458,7 @@ i0.ɵɵngDeclareClassMetadata({
2449
2458
  selector: "kirby-modal-footer",
2450
2459
  changeDetection: ChangeDetectionStrategy.OnPush,
2451
2460
  template: "<ion-footer role=\"presentation\">\n <ng-content></ng-content>\n</ion-footer>\n",
2452
- styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}ion-item-option.success{background-color:var(--kirby-color-fill-success);color:var(--kirby-color-content-success)}@media(hover:hover){ion-item-option.success:hover{background-color:var(--kirby-color-fill-success-hover);color:var(--kirby-color-content-success-hover)}}ion-item-option.success:active{background-color:var(--kirby-color-fill-success-active);color:var(--kirby-color-content-success-active)}ion-item-option.warning{background-color:var(--kirby-color-fill-warning);color:var(--kirby-color-content-warning)}@media(hover:hover){ion-item-option.warning:hover{background-color:var(--kirby-color-fill-warning-hover);color:var(--kirby-color-content-warning-hover)}}ion-item-option.warning:active{background-color:var(--kirby-color-fill-warning-active);color:var(--kirby-color-content-warning-active)}ion-item-option.danger{background-color:var(--kirby-color-fill-danger);color:var(--kirby-color-content-danger)}@media(hover:hover){ion-item-option.danger:hover{background-color:var(--kirby-color-fill-danger-hover);color:var(--kirby-color-content-danger-hover)}}ion-item-option.danger:active{background-color:var(--kirby-color-fill-danger-active);color:var(--kirby-color-content-danger-active)}ion-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);box-shadow:var(--kirby-elevation-8);box-sizing:inherit;display:flex;justify-content:var(--kirby-modal-footer-justify-content, center);align-items:center;background-color:var(--kirby-modal-footer-background, var(--kirby-color-fill-raised));color:var(--kirby-modal-footer-color, var(--kirby-color-content-raised));padding:var(--kirby-spacing-s);padding-bottom:calc(var(--kirby-spacing-xs) + var(--kirby-modal-safe-area-bottom))}@media(min-width:768px){ion-footer{padding:var(--kirby-spacing-m)}}:host{box-sizing:border-box;display:block}:host(.snap-to-keyboard) ion-footer{transition:transform var(--kirby-transition-soft-keyboard-leave)}:host(.light) ion-footer{--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);background-color:var(--kirby-background-color)}:host(.inline) ion-footer{--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);background:transparent;box-shadow:none}:host-context(.keyboard-visible).snap-to-keyboard ion-footer{transition:transform var(--kirby-transition-soft-keyboard-enter);transform:translateY(calc((var(--keyboard-offset, 0px) - var(--kirby-modal-safe-area-bottom)) * -1))}\n"]
2461
+ styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}ion-item-option.success{background-color:var(--kirby-color-fill-success);color:var(--kirby-color-content-success)}@media(hover:hover){ion-item-option.success:hover{background-color:var(--kirby-color-fill-success-hover);color:var(--kirby-color-content-success-hover)}}ion-item-option.success:active{background-color:var(--kirby-color-fill-success-active);color:var(--kirby-color-content-success-active)}ion-item-option.warning{background-color:var(--kirby-color-fill-warning);color:var(--kirby-color-content-warning)}@media(hover:hover){ion-item-option.warning:hover{background-color:var(--kirby-color-fill-warning-hover);color:var(--kirby-color-content-warning-hover)}}ion-item-option.warning:active{background-color:var(--kirby-color-fill-warning-active);color:var(--kirby-color-content-warning-active)}ion-item-option.danger{background-color:var(--kirby-color-fill-danger);color:var(--kirby-color-content-danger)}@media(hover:hover){ion-item-option.danger:hover{background-color:var(--kirby-color-fill-danger-hover);color:var(--kirby-color-content-danger-hover)}}ion-item-option.danger:active{background-color:var(--kirby-color-fill-danger-active);color:var(--kirby-color-content-danger-active)}ion-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);box-shadow:var(--kirby-elevation-8);box-sizing:inherit;display:flex;justify-content:var(--kirby-modal-footer-justify-content, center);align-items:center;background-color:var(--kirby-modal-footer-background, var(--kirby-color-fill-base));color:var(--kirby-modal-footer-color, var(--kirby-color-content-base));padding:var(--kirby-spacing-s);padding-bottom:calc(var(--kirby-spacing-xs) + var(--kirby-modal-safe-area-bottom))}@media(min-width:768px){ion-footer{padding:var(--kirby-spacing-m)}}:host{box-sizing:border-box;display:block}:host(.snap-to-keyboard) ion-footer{transition:transform var(--kirby-transition-soft-keyboard-leave)}:host(.light) ion-footer{--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)}:host(.inline) ion-footer{--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);background:transparent;box-shadow:none}:host-context(.keyboard-visible).snap-to-keyboard ion-footer{transition:transform var(--kirby-transition-soft-keyboard-enter);transform:translateY(calc((var(--keyboard-offset, 0px) - var(--kirby-modal-safe-area-bottom)) * -1))}\n"]
2453
2462
  }]
2454
2463
  }],
2455
2464
  ctorParameters: () => [{ type: i0.ElementRef }, {