@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-tab-navigation.mjs CHANGED
@@ -19,7 +19,7 @@ var TabNavigationItemComponent = class TabNavigationItemComponent {
19
19
  static {
20
20
  this.ɵfac = i0.ɵɵngDeclareFactory({
21
21
  minVersion: "12.0.0",
22
- version: "22.2.2",
22
+ version: "22.2.3",
23
23
  ngImport: i0,
24
24
  type: TabNavigationItemComponent,
25
25
  deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }],
@@ -29,7 +29,7 @@ var TabNavigationItemComponent = class TabNavigationItemComponent {
29
29
  static {
30
30
  this.ɵcmp = i0.ɵɵngDeclareComponent({
31
31
  minVersion: "14.0.0",
32
- version: "22.2.2",
32
+ version: "22.2.3",
33
33
  type: TabNavigationItemComponent,
34
34
  isStandalone: true,
35
35
  selector: "kirby-tab-navigation-item",
@@ -47,7 +47,7 @@ var TabNavigationItemComponent = class TabNavigationItemComponent {
47
47
  };
48
48
  i0.ɵɵngDeclareClassMetadata({
49
49
  minVersion: "12.0.0",
50
- version: "22.2.2",
50
+ version: "22.2.3",
51
51
  ngImport: i0,
52
52
  type: TabNavigationItemComponent,
53
53
  decorators: [{
@@ -181,7 +181,7 @@ var TabNavigationComponent = class TabNavigationComponent {
181
181
  static {
182
182
  this.ɵfac = i0.ɵɵngDeclareFactory({
183
183
  minVersion: "12.0.0",
184
- version: "22.2.2",
184
+ version: "22.2.3",
185
185
  ngImport: i0,
186
186
  type: TabNavigationComponent,
187
187
  deps: [
@@ -196,7 +196,7 @@ var TabNavigationComponent = class TabNavigationComponent {
196
196
  static {
197
197
  this.ɵcmp = i0.ɵɵngDeclareComponent({
198
198
  minVersion: "14.0.0",
199
- version: "22.2.2",
199
+ version: "22.2.3",
200
200
  type: TabNavigationComponent,
201
201
  isStandalone: true,
202
202
  selector: "kirby-tab-navigation",
@@ -224,14 +224,14 @@ var TabNavigationComponent = class TabNavigationComponent {
224
224
  }],
225
225
  ngImport: i0,
226
226
  template: "<div role=\"tablist\" #tabBar>\n <ng-content></ng-content>\n</div>\n",
227
- styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{display:block;position:relative}@media(max-width:767px){:host{inline-size:100dvi;margin-inline:calc(-1 * var(--padding-start)) calc(-1 * var(--padding-end))}}:host:before{content:\"\";background-color:var(--kirby-color-border-base-quiet);position:absolute;height:1px;bottom:0;z-index:var(--kirby-z-index-default);left:0;width:100%}div[role=tablist]{position:relative;margin:0 auto;display:flex;align-items:center;justify-content:left;flex-wrap:nowrap;overflow-x:scroll;column-gap:var(--kirby-spacing-xs);-webkit-overflow-scrolling:auto;scrollbar-width:none}div[role=tablist]::-webkit-scrollbar{display:none}@media(max-width:767px){div[role=tablist]{padding-inline:var(--padding-start) var(--padding-end)}}\n"],
227
+ styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{display:block;position:relative}@media(max-width:767px){:host{inline-size:100dvi;margin-inline:calc(-1 * var(--padding-start)) calc(-1 * var(--padding-end))}}:host:before{content:\"\";background-color:var(--kirby-color-border-base-quiet);position:absolute;height:var(--kirby-stroke-xs);bottom:0;z-index:var(--kirby-z-index-default);left:0;width:100%}div[role=tablist]{position:relative;margin:0 auto;display:flex;align-items:center;justify-content:left;flex-wrap:nowrap;overflow-x:scroll;column-gap:var(--kirby-spacing-xs);-webkit-overflow-scrolling:auto;scrollbar-width:none}div[role=tablist]::-webkit-scrollbar{display:none}@media(max-width:767px){div[role=tablist]{padding-inline:var(--padding-start) var(--padding-end)}}\n"],
228
228
  changeDetection: i0.ChangeDetectionStrategy.OnPush
229
229
  });
230
230
  }
231
231
  };
232
232
  i0.ɵɵngDeclareClassMetadata({
233
233
  minVersion: "12.0.0",
234
- version: "22.2.2",
234
+ version: "22.2.3",
235
235
  ngImport: i0,
236
236
  type: TabNavigationComponent,
237
237
  decorators: [{
@@ -240,7 +240,7 @@ i0.ɵɵngDeclareClassMetadata({
240
240
  selector: "kirby-tab-navigation",
241
241
  changeDetection: ChangeDetectionStrategy.OnPush,
242
242
  template: "<div role=\"tablist\" #tabBar>\n <ng-content></ng-content>\n</div>\n",
243
- styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{display:block;position:relative}@media(max-width:767px){:host{inline-size:100dvi;margin-inline:calc(-1 * var(--padding-start)) calc(-1 * var(--padding-end))}}:host:before{content:\"\";background-color:var(--kirby-color-border-base-quiet);position:absolute;height:1px;bottom:0;z-index:var(--kirby-z-index-default);left:0;width:100%}div[role=tablist]{position:relative;margin:0 auto;display:flex;align-items:center;justify-content:left;flex-wrap:nowrap;overflow-x:scroll;column-gap:var(--kirby-spacing-xs);-webkit-overflow-scrolling:auto;scrollbar-width:none}div[role=tablist]::-webkit-scrollbar{display:none}@media(max-width:767px){div[role=tablist]{padding-inline:var(--padding-start) var(--padding-end)}}\n"]
243
+ styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{display:block;position:relative}@media(max-width:767px){:host{inline-size:100dvi;margin-inline:calc(-1 * var(--padding-start)) calc(-1 * var(--padding-end))}}:host:before{content:\"\";background-color:var(--kirby-color-border-base-quiet);position:absolute;height:var(--kirby-stroke-xs);bottom:0;z-index:var(--kirby-z-index-default);left:0;width:100%}div[role=tablist]{position:relative;margin:0 auto;display:flex;align-items:center;justify-content:left;flex-wrap:nowrap;overflow-x:scroll;column-gap:var(--kirby-spacing-xs);-webkit-overflow-scrolling:auto;scrollbar-width:none}div[role=tablist]::-webkit-scrollbar{display:none}@media(max-width:767px){div[role=tablist]{padding-inline:var(--padding-start) var(--padding-end)}}\n"]
244
244
  }]
245
245
  }],
246
246
  ctorParameters: () => [
@@ -296,7 +296,7 @@ var TabNavigationModule = class TabNavigationModule {
296
296
  static {
297
297
  this.ɵfac = i0.ɵɵngDeclareFactory({
298
298
  minVersion: "12.0.0",
299
- version: "22.2.2",
299
+ version: "22.2.3",
300
300
  ngImport: i0,
301
301
  type: TabNavigationModule,
302
302
  deps: [],
@@ -306,7 +306,7 @@ var TabNavigationModule = class TabNavigationModule {
306
306
  static {
307
307
  this.ɵmod = i0.ɵɵngDeclareNgModule({
308
308
  minVersion: "14.0.0",
309
- version: "22.2.2",
309
+ version: "22.2.3",
310
310
  ngImport: i0,
311
311
  type: TabNavigationModule,
312
312
  imports: [
@@ -320,7 +320,7 @@ var TabNavigationModule = class TabNavigationModule {
320
320
  static {
321
321
  this.ɵinj = i0.ɵɵngDeclareInjector({
322
322
  minVersion: "12.0.0",
323
- version: "22.2.2",
323
+ version: "22.2.3",
324
324
  ngImport: i0,
325
325
  type: TabNavigationModule,
326
326
  imports: [CommonModule]
@@ -329,7 +329,7 @@ var TabNavigationModule = class TabNavigationModule {
329
329
  };
330
330
  i0.ɵɵngDeclareClassMetadata({
331
331
  minVersion: "12.0.0",
332
- version: "22.2.2",
332
+ version: "22.2.3",
333
333
  ngImport: i0,
334
334
  type: TabNavigationModule,
335
335
  decorators: [{
package/fesm2022/kirbydesign-designsystem-tab-navigation.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"kirbydesign-designsystem-tab-navigation.mjs","names":[],"sources":["../../tab-navigation/src/tab-navigation-item/tab-navigation-item.component.ts","../../tab-navigation/src/tab-navigation-item/tab-navigation-item.component.html","../../tab-navigation/src/tab-navigation/tab-navigation.component.ts","../../tab-navigation/src/tab-navigation/tab-navigation.component.html","../../tab-navigation/src/tab-navigation.module.ts"],"sourcesContent":["import {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n Input,\n Renderer2,\n} from '@angular/core';\nimport { forwardAttributes } from '@kirbydesign/designsystem/shared';\n\n@Component({\n selector: 'kirby-tab-navigation-item',\n templateUrl: './tab-navigation-item.component.html',\n styleUrls: ['./tab-navigation-item.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: { role: 'presentation' },\n})\nexport class TabNavigationItemComponent implements AfterViewInit {\n private _attributesToForward: string[] = ['aria-controls', 'id'];\n\n @Input()\n label = '';\n\n @Input()\n truncate = true;\n\n constructor(\n private elementRef: ElementRef<HTMLElement>,\n private renderer: Renderer2\n ) {}\n\n ngAfterViewInit(): void {\n const tabElement: HTMLElement = this.elementRef.nativeElement.querySelector('[role=\"tab\"]');\n forwardAttributes(\n this.elementRef.nativeElement,\n this._attributesToForward,\n this.renderer,\n tabElement\n );\n }\n}\n","<button role=\"tab\" type=\"button\" #tabButton>\n <span attr.data-text=\"{{ label }}\" [class.truncate]=\"truncate\">{{ label }}</span>\n <ng-content></ng-content>\n</button>\n","import {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n ElementRef,\n EventEmitter,\n HostListener,\n Input,\n Output,\n QueryList,\n Renderer2,\n ViewChild,\n} from '@angular/core';\nimport { WindowRef } from '@kirbydesign/designsystem/types';\nimport { KeyboardHandlerService } from '@kirbydesign/designsystem/dropdown';\nimport { forwardAttributes } from '@kirbydesign/designsystem/shared';\nimport { TabNavigationItemComponent } from '../tab-navigation-item/tab-navigation-item.component';\n\n@Component({\n selector: 'kirby-tab-navigation',\n templateUrl: './tab-navigation.component.html',\n styleUrls: ['./tab-navigation.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TabNavigationComponent implements AfterViewInit {\n public readonly DEBOUNCE_TIME_MS = 250;\n\n @ViewChild('tabBar')\n private tabBar: ElementRef<HTMLElement>;\n\n @ContentChildren(TabNavigationItemComponent, { read: ElementRef })\n private tabs: QueryList<ElementRef<HTMLElement>>;\n\n private tabBarElement: HTMLElement;\n private tabElements = new Array<HTMLElement>();\n private tabButtonElements = new Array<HTMLElement>();\n\n private _attributesToForward: string[] = ['aria-label', 'aria-labelledby'];\n\n @Input()\n get selectedIndex(): number {\n return this._selectedIndex;\n }\n\n set selectedIndex(index: number) {\n if (index !== this._selectedIndex && index !== -1) {\n this._selectedIndex = index;\n\n if (!this.containsFocus()) {\n this.focusIndex = index;\n }\n\n this.selectTab(this.selectedIndex);\n this.scrollToTab(this.selectedIndex);\n this.selectedIndexChange.emit(this.selectedIndex);\n }\n }\n private _selectedIndex = -1;\n\n get focusIndex(): number {\n return this._focusIndex;\n }\n\n set focusIndex(index: number) {\n if (index !== this._focusIndex) {\n this._focusIndex = index;\n\n this.updateRovingTabindex();\n }\n }\n private _focusIndex = -1;\n\n @Output()\n selectedIndexChange = new EventEmitter<number>();\n\n constructor(\n private window: WindowRef,\n private keyboardHandlerService: KeyboardHandlerService,\n private renderer: Renderer2,\n private elementRef: ElementRef<HTMLElement>\n ) {}\n\n ngAfterViewInit(): void {\n this.tabBarElement = this.tabBar.nativeElement;\n this.setTabElements();\n this.updateTabElementsOnChanges();\n\n forwardAttributes(\n this.elementRef.nativeElement,\n this._attributesToForward,\n this.renderer,\n this.tabBarElement\n );\n }\n\n @HostListener('click', ['$event'])\n onItemSelect(event: MouseEvent) {\n this.selectedIndex = this.indexOfTabNavButton(event.target);\n }\n\n @HostListener('keydown.home', ['$event'])\n @HostListener('keydown.end', ['$event'])\n @HostListener('keydown.arrowright', ['$event'])\n @HostListener('keydown.arrowleft', ['$event'])\n onKeydown(event: KeyboardEvent) {\n event.preventDefault();\n this.focusIndex = this.keyboardHandlerService.handle(\n event,\n this.focusIndex,\n this.tabElements.length - 1,\n true\n );\n this.scrollToTab(this.focusIndex);\n this.focusTab(this.focusIndex);\n }\n\n @HostListener('focusin', ['$event'])\n onFocusIn(event: FocusEvent) {\n const focusedIndex = this.indexOfTabNavButton(event.target);\n if (focusedIndex !== -1) {\n this.focusIndex = focusedIndex;\n }\n }\n\n @HostListener('focusout', ['$event'])\n onFocusOut(event: FocusEvent) {\n const focusLeftTabNavigation = !this.elementRef.nativeElement.contains(\n event.relatedTarget as Node\n );\n if (focusLeftTabNavigation) {\n this.focusIndex = this.selectedIndex;\n }\n }\n\n private selectTab(tabIndex: number): void {\n this.tabButtonElements.forEach((tabButtonElement, index) => {\n tabButtonElement.setAttribute('aria-selected', index === tabIndex ? 'true' : 'false');\n });\n }\n\n private updateRovingTabindex(): void {\n const tabStopIndex = this.isValidTabIndex(this.focusIndex) ? this.focusIndex : 0;\n\n this.tabButtonElements.forEach((tabButtonElement, index) => {\n tabButtonElement.setAttribute('tabindex', index === tabStopIndex ? '0' : '-1');\n });\n }\n\n private focusTab(tabIndex: number): void {\n if (this.isValidTabIndex(tabIndex)) {\n this.tabButtonElements[tabIndex].focus();\n }\n }\n\n private indexOfTabNavButton(target: EventTarget): number {\n return this.tabButtonElements.indexOf((target as Element).closest<HTMLElement>('[role=\"tab\"]'));\n }\n\n private isValidTabIndex(tabIndex: number): boolean {\n return 0 <= tabIndex && tabIndex < this.tabButtonElements.length;\n }\n\n private containsFocus(): boolean {\n return this.elementRef.nativeElement.contains(document.activeElement);\n }\n\n private scrollToTab(tabIndex: number): void {\n if (this.isValidTabIndex(tabIndex)) {\n const selectedTabElement = this.tabElements[tabIndex];\n const selectedTabElementWidth = selectedTabElement.getBoundingClientRect().width;\n const selectedTabElementOffsetLeft = selectedTabElement.offsetLeft;\n const tabBarElementWidth = this.tabBarElement.getBoundingClientRect().width;\n\n this.window.nativeWindow.requestAnimationFrame(() => {\n this.tabBarElement?.scrollTo({\n behavior: 'smooth',\n left: Math.max(\n 0,\n selectedTabElementOffsetLeft - (tabBarElementWidth - selectedTabElementWidth) / 2\n ),\n });\n });\n }\n }\n\n private setTabElements() {\n this.tabs.forEach((tab) => {\n this.tabElements.push(tab.nativeElement);\n });\n\n this.tabElements.forEach((tabElement) =>\n this.tabButtonElements.push(tabElement.querySelector('[role=\"tab\"]'))\n );\n\n this.selectTab(this.selectedIndex);\n this.updateRovingTabindex();\n\n setTimeout(() => {\n this.scrollToTab(this.focusIndex);\n }, this.DEBOUNCE_TIME_MS);\n }\n\n private updateTabElementsOnChanges() {\n this.tabs.changes.subscribe(() => {\n this.tabElements = [];\n this.tabButtonElements = [];\n this.setTabElements();\n });\n }\n}\n","<div role=\"tablist\" #tabBar>\n <ng-content></ng-content>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { TabNavigationComponent } from './tab-navigation/tab-navigation.component';\nimport { TabNavigationItemComponent } from './tab-navigation-item/tab-navigation-item.component';\n\n@NgModule({\n imports: [CommonModule, TabNavigationComponent, TabNavigationItemComponent],\n exports: [TabNavigationComponent, TabNavigationItemComponent],\n})\nexport class TabNavigationModule {}\n"],"mappings":"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"}
1
+ {"version":3,"file":"kirbydesign-designsystem-tab-navigation.mjs","names":[],"sources":["../../tab-navigation/src/tab-navigation-item/tab-navigation-item.component.ts","../../tab-navigation/src/tab-navigation-item/tab-navigation-item.component.html","../../tab-navigation/src/tab-navigation/tab-navigation.component.ts","../../tab-navigation/src/tab-navigation/tab-navigation.component.html","../../tab-navigation/src/tab-navigation.module.ts"],"sourcesContent":["import {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n Input,\n Renderer2,\n} from '@angular/core';\nimport { forwardAttributes } from '@kirbydesign/designsystem/shared';\n\n@Component({\n selector: 'kirby-tab-navigation-item',\n templateUrl: './tab-navigation-item.component.html',\n styleUrls: ['./tab-navigation-item.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: { role: 'presentation' },\n})\nexport class TabNavigationItemComponent implements AfterViewInit {\n private _attributesToForward: string[] = ['aria-controls', 'id'];\n\n @Input()\n label = '';\n\n @Input()\n truncate = true;\n\n constructor(\n private elementRef: ElementRef<HTMLElement>,\n private renderer: Renderer2\n ) {}\n\n ngAfterViewInit(): void {\n const tabElement: HTMLElement = this.elementRef.nativeElement.querySelector('[role=\"tab\"]');\n forwardAttributes(\n this.elementRef.nativeElement,\n this._attributesToForward,\n this.renderer,\n tabElement\n );\n }\n}\n","<button role=\"tab\" type=\"button\" #tabButton>\n <span attr.data-text=\"{{ label }}\" [class.truncate]=\"truncate\">{{ label }}</span>\n <ng-content></ng-content>\n</button>\n","import {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n ElementRef,\n EventEmitter,\n HostListener,\n Input,\n Output,\n QueryList,\n Renderer2,\n ViewChild,\n} from '@angular/core';\nimport { WindowRef } from '@kirbydesign/designsystem/types';\nimport { KeyboardHandlerService } from '@kirbydesign/designsystem/dropdown';\nimport { forwardAttributes } from '@kirbydesign/designsystem/shared';\nimport { TabNavigationItemComponent } from '../tab-navigation-item/tab-navigation-item.component';\n\n@Component({\n selector: 'kirby-tab-navigation',\n templateUrl: './tab-navigation.component.html',\n styleUrls: ['./tab-navigation.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TabNavigationComponent implements AfterViewInit {\n public readonly DEBOUNCE_TIME_MS = 250;\n\n @ViewChild('tabBar')\n private tabBar: ElementRef<HTMLElement>;\n\n @ContentChildren(TabNavigationItemComponent, { read: ElementRef })\n private tabs: QueryList<ElementRef<HTMLElement>>;\n\n private tabBarElement: HTMLElement;\n private tabElements = new Array<HTMLElement>();\n private tabButtonElements = new Array<HTMLElement>();\n\n private _attributesToForward: string[] = ['aria-label', 'aria-labelledby'];\n\n @Input()\n get selectedIndex(): number {\n return this._selectedIndex;\n }\n\n set selectedIndex(index: number) {\n if (index !== this._selectedIndex && index !== -1) {\n this._selectedIndex = index;\n\n if (!this.containsFocus()) {\n this.focusIndex = index;\n }\n\n this.selectTab(this.selectedIndex);\n this.scrollToTab(this.selectedIndex);\n this.selectedIndexChange.emit(this.selectedIndex);\n }\n }\n private _selectedIndex = -1;\n\n get focusIndex(): number {\n return this._focusIndex;\n }\n\n set focusIndex(index: number) {\n if (index !== this._focusIndex) {\n this._focusIndex = index;\n\n this.updateRovingTabindex();\n }\n }\n private _focusIndex = -1;\n\n @Output()\n selectedIndexChange = new EventEmitter<number>();\n\n constructor(\n private window: WindowRef,\n private keyboardHandlerService: KeyboardHandlerService,\n private renderer: Renderer2,\n private elementRef: ElementRef<HTMLElement>\n ) {}\n\n ngAfterViewInit(): void {\n this.tabBarElement = this.tabBar.nativeElement;\n this.setTabElements();\n this.updateTabElementsOnChanges();\n\n forwardAttributes(\n this.elementRef.nativeElement,\n this._attributesToForward,\n this.renderer,\n this.tabBarElement\n );\n }\n\n @HostListener('click', ['$event'])\n onItemSelect(event: MouseEvent) {\n this.selectedIndex = this.indexOfTabNavButton(event.target);\n }\n\n @HostListener('keydown.home', ['$event'])\n @HostListener('keydown.end', ['$event'])\n @HostListener('keydown.arrowright', ['$event'])\n @HostListener('keydown.arrowleft', ['$event'])\n onKeydown(event: KeyboardEvent) {\n event.preventDefault();\n this.focusIndex = this.keyboardHandlerService.handle(\n event,\n this.focusIndex,\n this.tabElements.length - 1,\n true\n );\n this.scrollToTab(this.focusIndex);\n this.focusTab(this.focusIndex);\n }\n\n @HostListener('focusin', ['$event'])\n onFocusIn(event: FocusEvent) {\n const focusedIndex = this.indexOfTabNavButton(event.target);\n if (focusedIndex !== -1) {\n this.focusIndex = focusedIndex;\n }\n }\n\n @HostListener('focusout', ['$event'])\n onFocusOut(event: FocusEvent) {\n const focusLeftTabNavigation = !this.elementRef.nativeElement.contains(\n event.relatedTarget as Node\n );\n if (focusLeftTabNavigation) {\n this.focusIndex = this.selectedIndex;\n }\n }\n\n private selectTab(tabIndex: number): void {\n this.tabButtonElements.forEach((tabButtonElement, index) => {\n tabButtonElement.setAttribute('aria-selected', index === tabIndex ? 'true' : 'false');\n });\n }\n\n private updateRovingTabindex(): void {\n const tabStopIndex = this.isValidTabIndex(this.focusIndex) ? this.focusIndex : 0;\n\n this.tabButtonElements.forEach((tabButtonElement, index) => {\n tabButtonElement.setAttribute('tabindex', index === tabStopIndex ? '0' : '-1');\n });\n }\n\n private focusTab(tabIndex: number): void {\n if (this.isValidTabIndex(tabIndex)) {\n this.tabButtonElements[tabIndex].focus();\n }\n }\n\n private indexOfTabNavButton(target: EventTarget): number {\n return this.tabButtonElements.indexOf((target as Element).closest<HTMLElement>('[role=\"tab\"]'));\n }\n\n private isValidTabIndex(tabIndex: number): boolean {\n return 0 <= tabIndex && tabIndex < this.tabButtonElements.length;\n }\n\n private containsFocus(): boolean {\n return this.elementRef.nativeElement.contains(document.activeElement);\n }\n\n private scrollToTab(tabIndex: number): void {\n if (this.isValidTabIndex(tabIndex)) {\n const selectedTabElement = this.tabElements[tabIndex];\n const selectedTabElementWidth = selectedTabElement.getBoundingClientRect().width;\n const selectedTabElementOffsetLeft = selectedTabElement.offsetLeft;\n const tabBarElementWidth = this.tabBarElement.getBoundingClientRect().width;\n\n this.window.nativeWindow.requestAnimationFrame(() => {\n this.tabBarElement?.scrollTo({\n behavior: 'smooth',\n left: Math.max(\n 0,\n selectedTabElementOffsetLeft - (tabBarElementWidth - selectedTabElementWidth) / 2\n ),\n });\n });\n }\n }\n\n private setTabElements() {\n this.tabs.forEach((tab) => {\n this.tabElements.push(tab.nativeElement);\n });\n\n this.tabElements.forEach((tabElement) =>\n this.tabButtonElements.push(tabElement.querySelector('[role=\"tab\"]'))\n );\n\n this.selectTab(this.selectedIndex);\n this.updateRovingTabindex();\n\n setTimeout(() => {\n this.scrollToTab(this.focusIndex);\n }, this.DEBOUNCE_TIME_MS);\n }\n\n private updateTabElementsOnChanges() {\n this.tabs.changes.subscribe(() => {\n this.tabElements = [];\n this.tabButtonElements = [];\n this.setTabElements();\n });\n }\n}\n","<div role=\"tablist\" #tabBar>\n <ng-content></ng-content>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { TabNavigationComponent } from './tab-navigation/tab-navigation.component';\nimport { TabNavigationItemComponent } from './tab-navigation-item/tab-navigation-item.component';\n\n@NgModule({\n imports: [CommonModule, TabNavigationComponent, TabNavigationItemComponent],\n exports: [TabNavigationComponent, TabNavigationItemComponent],\n})\nexport class TabNavigationModule {}\n"],"mappings":"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"}
package/fesm2022/kirbydesign-designsystem-tabs.mjs CHANGED
@@ -18,7 +18,7 @@ var TabsService = class TabsService {
18
18
  static {
19
19
  this.ɵfac = i0.ɵɵngDeclareFactory({
20
20
  minVersion: "12.0.0",
21
- version: "22.2.2",
21
+ version: "22.2.3",
22
22
  ngImport: i0,
23
23
  type: TabsService,
24
24
  deps: [],
@@ -28,7 +28,7 @@ var TabsService = class TabsService {
28
28
  static {
29
29
  this.ɵprov = i0.ɵɵngDeclareInjectable({
30
30
  minVersion: "12.0.0",
31
- version: "22.2.2",
31
+ version: "22.2.3",
32
32
  ngImport: i0,
33
33
  type: TabsService,
34
34
  providedIn: "root"
@@ -37,7 +37,7 @@ var TabsService = class TabsService {
37
37
  };
38
38
  i0.ɵɵngDeclareClassMetadata({
39
39
  minVersion: "12.0.0",
40
- version: "22.2.2",
40
+ version: "22.2.3",
41
41
  ngImport: i0,
42
42
  type: TabsService,
43
43
  decorators: [{
@@ -59,7 +59,7 @@ var TabsComponent = class TabsComponent {
59
59
  static {
60
60
  this.ɵfac = i0.ɵɵngDeclareFactory({
61
61
  minVersion: "12.0.0",
62
- version: "22.2.2",
62
+ version: "22.2.3",
63
63
  ngImport: i0,
64
64
  type: TabsComponent,
65
65
  deps: [{ token: TabsService }],
@@ -69,7 +69,7 @@ var TabsComponent = class TabsComponent {
69
69
  static {
70
70
  this.ɵcmp = i0.ɵɵngDeclareComponent({
71
71
  minVersion: "14.0.0",
72
- version: "22.2.2",
72
+ version: "22.2.3",
73
73
  type: TabsComponent,
74
74
  isStandalone: true,
75
75
  selector: "kirby-tab-bar",
@@ -83,7 +83,7 @@ var TabsComponent = class TabsComponent {
83
83
  }],
84
84
  ngImport: i0,
85
85
  template: "<ion-tabs>\n <ion-tab-bar class=\"kirby-surface-raised\" [class.bottom-hidden]=\"tabBarBottomHidden\">\n <ng-content></ng-content>\n </ion-tab-bar>\n</ion-tabs>\n",
86
- styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host(:not(.tab-bar-bottom-hidden)){--kirby-page-footer-safe-area-bottom: 0px}ion-tabs ion-tab-bar{--background: var(--kirby-color-fill-raised);--border: 1px solid var(--kirby-color-border-raised-quiet);--color: var(--kirby-color-content-raised);display:flex;max-width:var(--kirby-tab-bar-max-width, none);justify-content:center;height:var(--kirby-tab-bar-height);padding-left:calc((100vw - var(--kirby-tab-bar-max-width, none)) / 2);padding-right:calc((100vw - var(--kirby-tab-bar-max-width, none)) / 2);width:100%}ion-tabs ion-tab-bar.bottom-hidden{display:none}@media(min-width:768px){ion-tabs{--kirby-tab-bar-height: 70px}ion-tabs ion-tab-bar{column-gap:var(--kirby-spacing-m)}}@media(min-width:992px){ion-tabs{flex-direction:column-reverse;--kirby-page-footer-safe-area-bottom: initial}ion-tabs ion-tab-bar{margin:0 auto;justify-content:flex-end;column-gap:initial}ion-tabs ion-tab-bar.bottom-hidden{display:flex}}\n"],
86
+ styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host(:not(.tab-bar-bottom-hidden)){--kirby-page-footer-safe-area-bottom: 0px}ion-tabs ion-tab-bar{--background: var(--kirby-color-fill-raised);--border: var(--kirby-stroke-xs) solid var(--kirby-color-border-raised-quiet);--color: var(--kirby-color-content-raised);display:flex;max-width:var(--kirby-tab-bar-max-width, none);justify-content:center;height:var(--kirby-tab-bar-height);padding-left:calc((100vw - var(--kirby-tab-bar-max-width, none)) / 2);padding-right:calc((100vw - var(--kirby-tab-bar-max-width, none)) / 2);width:100%}ion-tabs ion-tab-bar.bottom-hidden{display:none}@media(min-width:768px){ion-tabs{--kirby-tab-bar-height: 70px}ion-tabs ion-tab-bar{column-gap:var(--kirby-spacing-m)}}@media(min-width:992px){ion-tabs{flex-direction:column-reverse;--kirby-page-footer-safe-area-bottom: initial}ion-tabs ion-tab-bar{margin:0 auto;justify-content:flex-end;column-gap:initial}ion-tabs ion-tab-bar.bottom-hidden{display:flex}}\n"],
87
87
  dependencies: [{
88
88
  kind: "component",
89
89
  type: IonTabs,
@@ -105,7 +105,7 @@ var TabsComponent = class TabsComponent {
105
105
  };
106
106
  i0.ɵɵngDeclareClassMetadata({
107
107
  minVersion: "12.0.0",
108
- version: "22.2.2",
108
+ version: "22.2.3",
109
109
  ngImport: i0,
110
110
  type: TabsComponent,
111
111
  decorators: [{
@@ -115,7 +115,7 @@ i0.ɵɵngDeclareClassMetadata({
115
115
  imports: [IonTabs, IonTabBar],
116
116
  changeDetection: ChangeDetectionStrategy.Eager,
117
117
  template: "<ion-tabs>\n <ion-tab-bar class=\"kirby-surface-raised\" [class.bottom-hidden]=\"tabBarBottomHidden\">\n <ng-content></ng-content>\n </ion-tab-bar>\n</ion-tabs>\n",
118
- styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host(:not(.tab-bar-bottom-hidden)){--kirby-page-footer-safe-area-bottom: 0px}ion-tabs ion-tab-bar{--background: var(--kirby-color-fill-raised);--border: 1px solid var(--kirby-color-border-raised-quiet);--color: var(--kirby-color-content-raised);display:flex;max-width:var(--kirby-tab-bar-max-width, none);justify-content:center;height:var(--kirby-tab-bar-height);padding-left:calc((100vw - var(--kirby-tab-bar-max-width, none)) / 2);padding-right:calc((100vw - var(--kirby-tab-bar-max-width, none)) / 2);width:100%}ion-tabs ion-tab-bar.bottom-hidden{display:none}@media(min-width:768px){ion-tabs{--kirby-tab-bar-height: 70px}ion-tabs ion-tab-bar{column-gap:var(--kirby-spacing-m)}}@media(min-width:992px){ion-tabs{flex-direction:column-reverse;--kirby-page-footer-safe-area-bottom: initial}ion-tabs ion-tab-bar{margin:0 auto;justify-content:flex-end;column-gap:initial}ion-tabs ion-tab-bar.bottom-hidden{display:flex}}\n"]
118
+ styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host(:not(.tab-bar-bottom-hidden)){--kirby-page-footer-safe-area-bottom: 0px}ion-tabs ion-tab-bar{--background: var(--kirby-color-fill-raised);--border: var(--kirby-stroke-xs) solid var(--kirby-color-border-raised-quiet);--color: var(--kirby-color-content-raised);display:flex;max-width:var(--kirby-tab-bar-max-width, none);justify-content:center;height:var(--kirby-tab-bar-height);padding-left:calc((100vw - var(--kirby-tab-bar-max-width, none)) / 2);padding-right:calc((100vw - var(--kirby-tab-bar-max-width, none)) / 2);width:100%}ion-tabs ion-tab-bar.bottom-hidden{display:none}@media(min-width:768px){ion-tabs{--kirby-tab-bar-height: 70px}ion-tabs ion-tab-bar{column-gap:var(--kirby-spacing-m)}}@media(min-width:992px){ion-tabs{flex-direction:column-reverse;--kirby-page-footer-safe-area-bottom: initial}ion-tabs ion-tab-bar{margin:0 auto;justify-content:flex-end;column-gap:initial}ion-tabs ion-tab-bar.bottom-hidden{display:flex}}\n"]
119
119
  }]
120
120
  }],
121
121
  ctorParameters: () => [{ type: TabsService }],
@@ -145,7 +145,7 @@ var TabButtonComponent = class TabButtonComponent {
145
145
  static {
146
146
  this.ɵfac = i0.ɵɵngDeclareFactory({
147
147
  minVersion: "12.0.0",
148
- version: "22.2.2",
148
+ version: "22.2.3",
149
149
  ngImport: i0,
150
150
  type: TabButtonComponent,
151
151
  deps: [],
@@ -155,7 +155,7 @@ var TabButtonComponent = class TabButtonComponent {
155
155
  static {
156
156
  this.ɵcmp = i0.ɵɵngDeclareComponent({
157
157
  minVersion: "17.0.0",
158
- version: "22.2.2",
158
+ version: "22.2.3",
159
159
  type: TabButtonComponent,
160
160
  isStandalone: true,
161
161
  selector: "kirby-tab-button",
@@ -190,7 +190,7 @@ var TabButtonComponent = class TabButtonComponent {
190
190
  };
191
191
  i0.ɵɵngDeclareClassMetadata({
192
192
  minVersion: "12.0.0",
193
- version: "22.2.2",
193
+ version: "22.2.3",
194
194
  ngImport: i0,
195
195
  type: TabButtonComponent,
196
196
  decorators: [{
@@ -216,7 +216,7 @@ var TabsModule = class TabsModule {
216
216
  static {
217
217
  this.ɵfac = i0.ɵɵngDeclareFactory({
218
218
  minVersion: "12.0.0",
219
- version: "22.2.2",
219
+ version: "22.2.3",
220
220
  ngImport: i0,
221
221
  type: TabsModule,
222
222
  deps: [],
@@ -226,7 +226,7 @@ var TabsModule = class TabsModule {
226
226
  static {
227
227
  this.ɵmod = i0.ɵɵngDeclareNgModule({
228
228
  minVersion: "14.0.0",
229
- version: "22.2.2",
229
+ version: "22.2.3",
230
230
  ngImport: i0,
231
231
  type: TabsModule,
232
232
  imports: [
@@ -244,7 +244,7 @@ var TabsModule = class TabsModule {
244
244
  static {
245
245
  this.ɵinj = i0.ɵɵngDeclareInjector({
246
246
  minVersion: "12.0.0",
247
- version: "22.2.2",
247
+ version: "22.2.3",
248
248
  ngImport: i0,
249
249
  type: TabsModule,
250
250
  providers: [TabsService],
@@ -262,7 +262,7 @@ var TabsModule = class TabsModule {
262
262
  };
263
263
  i0.ɵɵngDeclareClassMetadata({
264
264
  minVersion: "12.0.0",
265
- version: "22.2.2",
265
+ version: "22.2.3",
266
266
  ngImport: i0,
267
267
  type: TabsModule,
268
268
  decorators: [{
package/fesm2022/kirbydesign-designsystem-tabs.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"kirbydesign-designsystem-tabs.mjs","names":[],"sources":["../../tabs/src/tabs.service.ts","../../tabs/src/tabs.component.ts","../../tabs/src/tabs.component.html","../../tabs/src/tab-button/tab-button.events.ts","../../tabs/src/tab-button/tab-button.component.ts","../../tabs/src/tab-button/tab-button.component.html","../../tabs/src/tabs.module.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { IonRouterOutlet } from '@ionic/angular';\nimport { ReplaySubject } from 'rxjs';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class TabsService {\n private outletSubject$: ReplaySubject<IonRouterOutlet> = new ReplaySubject(1);\n public outlet$ = this.outletSubject$.asObservable();\n\n public setOutlet(outlet: IonRouterOutlet) {\n this.outletSubject$.next(outlet);\n }\n\n public resetOutlet() {\n this.outletSubject$.next(null);\n }\n}\n\nexport { IonRouterOutlet };\n","import {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n HostBinding,\n OnDestroy,\n ViewChild,\n} from '@angular/core';\nimport { IonTabBar, IonTabs } from '@ionic/angular';\n\nimport { TabsService } from './tabs.service';\n\n@Component({\n selector: 'kirby-tab-bar',\n templateUrl: './tabs.component.html',\n styleUrls: ['./tabs.component.scss'],\n imports: [IonTabs, IonTabBar],\n changeDetection: ChangeDetectionStrategy.Eager,\n})\nexport class TabsComponent implements AfterViewInit, OnDestroy {\n @HostBinding('class.tab-bar-bottom-hidden')\n tabBarBottomHidden = false;\n @ViewChild(IonTabs, { static: true }) tabs: IonTabs;\n\n constructor(private tabsService: TabsService) {}\n\n ngAfterViewInit() {\n this.tabsService.setOutlet(this.tabs.outlet);\n }\n\n ngOnDestroy() {\n this.tabsService.resetOutlet();\n }\n}\n","<ion-tabs>\n <ion-tab-bar class=\"kirby-surface-raised\" [class.bottom-hidden]=\"tabBarBottomHidden\">\n <ng-content></ng-content>\n </ion-tab-bar>\n</ion-tabs>\n","export const selectedTabClickEvent = 'kirbySelectedTabClick';\n","import {\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n EventEmitter,\n Input,\n Output,\n QueryList,\n} from '@angular/core';\n\nimport { IconComponent } from '@kirbydesign/designsystem/icon';\nimport { IonTabButton } from '@ionic/angular';\nimport { selectedTabClickEvent } from './tab-button.events';\n\n@Component({\n selector: 'kirby-tab-button',\n templateUrl: './tab-button.component.html',\n styleUrls: ['./tab-button.component.scss'],\n imports: [IonTabButton],\n changeDetection: ChangeDetectionStrategy.Eager,\n})\nexport class TabButtonComponent {\n @Input() tab: string;\n @Output() click = new EventEmitter<Event>();\n @ContentChildren(IconComponent) icons: QueryList<IconComponent>;\n\n onClick(event: Event, isSelected: boolean) {\n this.click.emit(event);\n\n if (isSelected) {\n const clickEvent = new CustomEvent(selectedTabClickEvent);\n dispatchEvent(clickEvent);\n }\n }\n}\n","<ion-tab-button\n #ionTabButton\n [tab]=\"tab\"\n (click)=\"onClick($event, ionTabButton.selected)\"\n tabindex=\"0\"\n>\n @if (icons.length === 1 || !ionTabButton.selected) {\n <ng-content select=\"kirby-icon:not([selected-tab])\"></ng-content>\n }\n @if (ionTabButton.selected) {\n <ng-content select=\"kirby-icon[selected-tab]\"></ng-content>\n }\n <ng-content></ng-content>\n <ng-content select=\"kirby-badge\"></ng-content>\n</ion-tab-button>\n","import { CommonModule } from '@angular/common';\n\nimport { IconModule } from '@kirbydesign/designsystem/icon';\nimport { NgModule } from '@angular/core';\nimport { IonTabBar, IonTabButton, IonTabs } from '@ionic/angular';\nimport { TabButtonComponent } from './tab-button/tab-button.component';\nimport { TabsService } from './tabs.service';\nimport { TabsComponent } from './tabs.component';\n\n@NgModule({\n imports: [\n IconModule,\n CommonModule,\n IonTabs,\n IonTabBar,\n IonTabButton,\n TabsComponent,\n TabButtonComponent,\n ],\n providers: [TabsService],\n exports: [TabsComponent, TabButtonComponent],\n})\nexport class TabsModule {}\n"],"mappings":"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"}
1
+ {"version":3,"file":"kirbydesign-designsystem-tabs.mjs","names":[],"sources":["../../tabs/src/tabs.service.ts","../../tabs/src/tabs.component.ts","../../tabs/src/tabs.component.html","../../tabs/src/tab-button/tab-button.events.ts","../../tabs/src/tab-button/tab-button.component.ts","../../tabs/src/tab-button/tab-button.component.html","../../tabs/src/tabs.module.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { IonRouterOutlet } from '@ionic/angular';\nimport { ReplaySubject } from 'rxjs';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class TabsService {\n private outletSubject$: ReplaySubject<IonRouterOutlet> = new ReplaySubject(1);\n public outlet$ = this.outletSubject$.asObservable();\n\n public setOutlet(outlet: IonRouterOutlet) {\n this.outletSubject$.next(outlet);\n }\n\n public resetOutlet() {\n this.outletSubject$.next(null);\n }\n}\n\nexport { IonRouterOutlet };\n","import {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n HostBinding,\n OnDestroy,\n ViewChild,\n} from '@angular/core';\nimport { IonTabBar, IonTabs } from '@ionic/angular';\n\nimport { TabsService } from './tabs.service';\n\n@Component({\n selector: 'kirby-tab-bar',\n templateUrl: './tabs.component.html',\n styleUrls: ['./tabs.component.scss'],\n imports: [IonTabs, IonTabBar],\n changeDetection: ChangeDetectionStrategy.Eager,\n})\nexport class TabsComponent implements AfterViewInit, OnDestroy {\n @HostBinding('class.tab-bar-bottom-hidden')\n tabBarBottomHidden = false;\n @ViewChild(IonTabs, { static: true }) tabs: IonTabs;\n\n constructor(private tabsService: TabsService) {}\n\n ngAfterViewInit() {\n this.tabsService.setOutlet(this.tabs.outlet);\n }\n\n ngOnDestroy() {\n this.tabsService.resetOutlet();\n }\n}\n","<ion-tabs>\n <ion-tab-bar class=\"kirby-surface-raised\" [class.bottom-hidden]=\"tabBarBottomHidden\">\n <ng-content></ng-content>\n </ion-tab-bar>\n</ion-tabs>\n","export const selectedTabClickEvent = 'kirbySelectedTabClick';\n","import {\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n EventEmitter,\n Input,\n Output,\n QueryList,\n} from '@angular/core';\n\nimport { IconComponent } from '@kirbydesign/designsystem/icon';\nimport { IonTabButton } from '@ionic/angular';\nimport { selectedTabClickEvent } from './tab-button.events';\n\n@Component({\n selector: 'kirby-tab-button',\n templateUrl: './tab-button.component.html',\n styleUrls: ['./tab-button.component.scss'],\n imports: [IonTabButton],\n changeDetection: ChangeDetectionStrategy.Eager,\n})\nexport class TabButtonComponent {\n @Input() tab: string;\n @Output() click = new EventEmitter<Event>();\n @ContentChildren(IconComponent) icons: QueryList<IconComponent>;\n\n onClick(event: Event, isSelected: boolean) {\n this.click.emit(event);\n\n if (isSelected) {\n const clickEvent = new CustomEvent(selectedTabClickEvent);\n dispatchEvent(clickEvent);\n }\n }\n}\n","<ion-tab-button\n #ionTabButton\n [tab]=\"tab\"\n (click)=\"onClick($event, ionTabButton.selected)\"\n tabindex=\"0\"\n>\n @if (icons.length === 1 || !ionTabButton.selected) {\n <ng-content select=\"kirby-icon:not([selected-tab])\"></ng-content>\n }\n @if (ionTabButton.selected) {\n <ng-content select=\"kirby-icon[selected-tab]\"></ng-content>\n }\n <ng-content></ng-content>\n <ng-content select=\"kirby-badge\"></ng-content>\n</ion-tab-button>\n","import { CommonModule } from '@angular/common';\n\nimport { IconModule } from '@kirbydesign/designsystem/icon';\nimport { NgModule } from '@angular/core';\nimport { IonTabBar, IonTabButton, IonTabs } from '@ionic/angular';\nimport { TabButtonComponent } from './tab-button/tab-button.component';\nimport { TabsService } from './tabs.service';\nimport { TabsComponent } from './tabs.component';\n\n@NgModule({\n imports: [\n IconModule,\n CommonModule,\n IonTabs,\n IonTabBar,\n IonTabButton,\n TabsComponent,\n TabButtonComponent,\n ],\n providers: [TabsService],\n exports: [TabsComponent, TabButtonComponent],\n})\nexport class TabsModule {}\n"],"mappings":"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"}