@skyux/lists 5.9.4 → 6.0.0-beta.10

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 (142) hide show
  1. package/documentation.json +20 -20
  2. package/esm2020/index.mjs +22 -0
  3. package/esm2020/lib/modules/filter/filter-button.component.mjs +62 -0
  4. package/esm2020/lib/modules/filter/filter-inline-item.component.mjs +14 -0
  5. package/esm2020/lib/modules/filter/filter-inline.component.mjs +14 -0
  6. package/esm2020/lib/modules/filter/filter-summary-item.component.mjs +45 -0
  7. package/esm2020/lib/modules/filter/filter-summary.component.mjs +15 -0
  8. package/esm2020/lib/modules/filter/filter.module.mjs +61 -0
  9. package/esm2020/lib/modules/infinite-scroll/infinite-scroll-dom-adapter.service.mjs +93 -0
  10. package/esm2020/lib/modules/infinite-scroll/infinite-scroll.component.mjs +109 -0
  11. package/esm2020/lib/modules/infinite-scroll/infinite-scroll.module.mjs +20 -0
  12. package/esm2020/lib/modules/paging/paging.component.mjs +122 -0
  13. package/esm2020/lib/modules/paging/paging.module.mjs +34 -0
  14. package/esm2020/lib/modules/repeater/repeater-adapter.service.mjs +69 -0
  15. package/esm2020/lib/modules/repeater/repeater-item-content.component.mjs +14 -0
  16. package/esm2020/lib/modules/repeater/repeater-item-context-menu.component.mjs +17 -0
  17. package/esm2020/lib/modules/repeater/repeater-item-title.component.mjs +14 -0
  18. package/esm2020/lib/modules/repeater/repeater-item.component.mjs +383 -0
  19. package/esm2020/lib/modules/repeater/repeater.component.mjs +258 -0
  20. package/esm2020/lib/modules/repeater/repeater.module.mjs +70 -0
  21. package/esm2020/lib/modules/repeater/repeater.service.mjs +72 -0
  22. package/esm2020/lib/modules/shared/sky-lists-resources.module.mjs +81 -0
  23. package/esm2020/lib/modules/sort/sort-item.component.mjs +60 -0
  24. package/esm2020/lib/modules/sort/sort-menu-heading.component.mjs +13 -0
  25. package/esm2020/lib/modules/sort/sort.component.mjs +35 -0
  26. package/esm2020/lib/modules/sort/sort.module.mjs +50 -0
  27. package/esm2020/lib/modules/sort/sort.service.mjs +20 -0
  28. package/esm2020/skyux-lists.mjs +5 -0
  29. package/esm2020/testing/filter/filter-fixture-button.mjs +46 -0
  30. package/esm2020/testing/filter/filter-fixture-summary.mjs +28 -0
  31. package/esm2020/testing/filter/filter-testing.module.mjs +15 -0
  32. package/esm2020/testing/filter/lists-filter-fixture-button.mjs +2 -0
  33. package/esm2020/testing/infinite-scroll/infinite-scroll-fixture.mjs +27 -0
  34. package/esm2020/testing/infinite-scroll/infinite-scroll-testing.module.mjs +15 -0
  35. package/esm2020/testing/paging/paging-fixture-button.mjs +2 -0
  36. package/esm2020/testing/paging/paging-fixture.mjs +93 -0
  37. package/esm2020/testing/paging/paging-testing.module.mjs +15 -0
  38. package/esm2020/testing/public-api.mjs +13 -0
  39. package/esm2020/testing/skyux-lists-testing.mjs +5 -0
  40. package/esm2020/testing/sort/sort-fixture-menu-item.mjs +2 -0
  41. package/esm2020/testing/sort/sort-fixture-menu.mjs +2 -0
  42. package/esm2020/testing/sort/sort-fixture.mjs +140 -0
  43. package/esm2020/testing/sort/sort-testing.module.mjs +17 -0
  44. package/fesm2015/{skyux-lists-testing.js → skyux-lists-testing.mjs} +17 -17
  45. package/fesm2015/skyux-lists-testing.mjs.map +1 -0
  46. package/fesm2015/skyux-lists.mjs +1619 -0
  47. package/fesm2015/skyux-lists.mjs.map +1 -0
  48. package/fesm2020/skyux-lists-testing.mjs +389 -0
  49. package/fesm2020/skyux-lists-testing.mjs.map +1 -0
  50. package/fesm2020/skyux-lists.mjs +1619 -0
  51. package/fesm2020/skyux-lists.mjs.map +1 -0
  52. package/package.json +43 -19
  53. package/testing/package.json +5 -5
  54. package/bundles/skyux-lists-testing.umd.js +0 -887
  55. package/bundles/skyux-lists.umd.js +0 -2150
  56. package/esm2015/index.js +0 -22
  57. package/esm2015/index.js.map +0 -1
  58. package/esm2015/lib/modules/filter/filter-button.component.js +0 -67
  59. package/esm2015/lib/modules/filter/filter-button.component.js.map +0 -1
  60. package/esm2015/lib/modules/filter/filter-inline-item.component.js +0 -18
  61. package/esm2015/lib/modules/filter/filter-inline-item.component.js.map +0 -1
  62. package/esm2015/lib/modules/filter/filter-inline.component.js +0 -18
  63. package/esm2015/lib/modules/filter/filter-inline.component.js.map +0 -1
  64. package/esm2015/lib/modules/filter/filter-summary-item.component.js +0 -50
  65. package/esm2015/lib/modules/filter/filter-summary-item.component.js.map +0 -1
  66. package/esm2015/lib/modules/filter/filter-summary.component.js +0 -20
  67. package/esm2015/lib/modules/filter/filter-summary.component.js.map +0 -1
  68. package/esm2015/lib/modules/filter/filter.module.js +0 -61
  69. package/esm2015/lib/modules/filter/filter.module.js.map +0 -1
  70. package/esm2015/lib/modules/infinite-scroll/infinite-scroll-dom-adapter.service.js +0 -93
  71. package/esm2015/lib/modules/infinite-scroll/infinite-scroll-dom-adapter.service.js.map +0 -1
  72. package/esm2015/lib/modules/infinite-scroll/infinite-scroll.component.js +0 -115
  73. package/esm2015/lib/modules/infinite-scroll/infinite-scroll.component.js.map +0 -1
  74. package/esm2015/lib/modules/infinite-scroll/infinite-scroll.module.js +0 -20
  75. package/esm2015/lib/modules/infinite-scroll/infinite-scroll.module.js.map +0 -1
  76. package/esm2015/lib/modules/paging/paging.component.js +0 -127
  77. package/esm2015/lib/modules/paging/paging.component.js.map +0 -1
  78. package/esm2015/lib/modules/paging/paging.module.js +0 -34
  79. package/esm2015/lib/modules/paging/paging.module.js.map +0 -1
  80. package/esm2015/lib/modules/repeater/repeater-adapter.service.js +0 -69
  81. package/esm2015/lib/modules/repeater/repeater-adapter.service.js.map +0 -1
  82. package/esm2015/lib/modules/repeater/repeater-item-content.component.js +0 -17
  83. package/esm2015/lib/modules/repeater/repeater-item-content.component.js.map +0 -1
  84. package/esm2015/lib/modules/repeater/repeater-item-context-menu.component.js +0 -20
  85. package/esm2015/lib/modules/repeater/repeater-item-context-menu.component.js.map +0 -1
  86. package/esm2015/lib/modules/repeater/repeater-item-title.component.js +0 -17
  87. package/esm2015/lib/modules/repeater/repeater-item-title.component.js.map +0 -1
  88. package/esm2015/lib/modules/repeater/repeater-item.component.js +0 -389
  89. package/esm2015/lib/modules/repeater/repeater-item.component.js.map +0 -1
  90. package/esm2015/lib/modules/repeater/repeater.component.js +0 -262
  91. package/esm2015/lib/modules/repeater/repeater.component.js.map +0 -1
  92. package/esm2015/lib/modules/repeater/repeater.module.js +0 -69
  93. package/esm2015/lib/modules/repeater/repeater.module.js.map +0 -1
  94. package/esm2015/lib/modules/repeater/repeater.service.js +0 -72
  95. package/esm2015/lib/modules/repeater/repeater.service.js.map +0 -1
  96. package/esm2015/lib/modules/shared/sky-lists-resources.module.js +0 -81
  97. package/esm2015/lib/modules/shared/sky-lists-resources.module.js.map +0 -1
  98. package/esm2015/lib/modules/sort/sort-item.component.js +0 -65
  99. package/esm2015/lib/modules/sort/sort-item.component.js.map +0 -1
  100. package/esm2015/lib/modules/sort/sort-menu-heading.component.js +0 -17
  101. package/esm2015/lib/modules/sort/sort-menu-heading.component.js.map +0 -1
  102. package/esm2015/lib/modules/sort/sort.component.js +0 -41
  103. package/esm2015/lib/modules/sort/sort.component.js.map +0 -1
  104. package/esm2015/lib/modules/sort/sort.module.js +0 -50
  105. package/esm2015/lib/modules/sort/sort.module.js.map +0 -1
  106. package/esm2015/lib/modules/sort/sort.service.js +0 -20
  107. package/esm2015/lib/modules/sort/sort.service.js.map +0 -1
  108. package/esm2015/skyux-lists.js +0 -5
  109. package/esm2015/skyux-lists.js.map +0 -1
  110. package/esm2015/testing/filter/filter-fixture-button.js +0 -50
  111. package/esm2015/testing/filter/filter-fixture-button.js.map +0 -1
  112. package/esm2015/testing/filter/filter-fixture-summary.js +0 -31
  113. package/esm2015/testing/filter/filter-fixture-summary.js.map +0 -1
  114. package/esm2015/testing/filter/filter-testing.module.js +0 -15
  115. package/esm2015/testing/filter/filter-testing.module.js.map +0 -1
  116. package/esm2015/testing/filter/lists-filter-fixture-button.js +0 -2
  117. package/esm2015/testing/filter/lists-filter-fixture-button.js.map +0 -1
  118. package/esm2015/testing/infinite-scroll/infinite-scroll-fixture.js +0 -30
  119. package/esm2015/testing/infinite-scroll/infinite-scroll-fixture.js.map +0 -1
  120. package/esm2015/testing/infinite-scroll/infinite-scroll-testing.module.js +0 -15
  121. package/esm2015/testing/infinite-scroll/infinite-scroll-testing.module.js.map +0 -1
  122. package/esm2015/testing/paging/paging-fixture-button.js +0 -2
  123. package/esm2015/testing/paging/paging-fixture-button.js.map +0 -1
  124. package/esm2015/testing/paging/paging-fixture.js +0 -104
  125. package/esm2015/testing/paging/paging-fixture.js.map +0 -1
  126. package/esm2015/testing/paging/paging-testing.module.js +0 -15
  127. package/esm2015/testing/paging/paging-testing.module.js.map +0 -1
  128. package/esm2015/testing/public-api.js +0 -13
  129. package/esm2015/testing/public-api.js.map +0 -1
  130. package/esm2015/testing/skyux-lists-testing.js +0 -5
  131. package/esm2015/testing/skyux-lists-testing.js.map +0 -1
  132. package/esm2015/testing/sort/sort-fixture-menu-item.js +0 -2
  133. package/esm2015/testing/sort/sort-fixture-menu-item.js.map +0 -1
  134. package/esm2015/testing/sort/sort-fixture-menu.js +0 -2
  135. package/esm2015/testing/sort/sort-fixture-menu.js.map +0 -1
  136. package/esm2015/testing/sort/sort-fixture.js +0 -152
  137. package/esm2015/testing/sort/sort-fixture.js.map +0 -1
  138. package/esm2015/testing/sort/sort-testing.module.js +0 -17
  139. package/esm2015/testing/sort/sort-testing.module.js.map +0 -1
  140. package/fesm2015/skyux-lists-testing.js.map +0 -1
  141. package/fesm2015/skyux-lists.js +0 -1686
  142. package/fesm2015/skyux-lists.js.map +0 -1
@@ -0,0 +1,1619 @@
1
+ import * as i2 from '@angular/common';
2
+ import { CommonModule } from '@angular/common';
3
+ import * as i0 from '@angular/core';
4
+ import { NgModule, EventEmitter, Component, ChangeDetectionStrategy, Input, Output, Injectable, ElementRef, ViewEncapsulation, ContentChild, HostBinding, ViewChild, ContentChildren } from '@angular/core';
5
+ import * as i1 from '@skyux/indicators';
6
+ import { SkyIconModule, SkyTokensModule, SkyWaitModule, SkyChevronModule } from '@skyux/indicators';
7
+ import * as i3 from '@skyux/theme';
8
+ import { SkyThemeModule } from '@skyux/theme';
9
+ import * as i4 from '@skyux/i18n';
10
+ import { getLibStringForLocale, SkyI18nModule, SKY_LIB_RESOURCES_PROVIDERS } from '@skyux/i18n';
11
+ import { Subject, fromEvent, BehaviorSubject, forkJoin } from 'rxjs';
12
+ import { takeUntil, filter, map } from 'rxjs/operators';
13
+ import * as i1$1 from '@skyux/core';
14
+ import { SkyIdModule } from '@skyux/core';
15
+ import * as i6 from '@skyux/forms';
16
+ import { SkyCheckboxModule } from '@skyux/forms';
17
+ import * as i4$1 from '@skyux/inline-form';
18
+ import { SkyInlineFormModule } from '@skyux/inline-form';
19
+ import * as i3$1 from 'ng2-dragula';
20
+ import { DragulaModule, DragulaService } from 'ng2-dragula';
21
+ import { skyAnimationSlide } from '@skyux/animations';
22
+ import * as i1$2 from '@skyux/popovers';
23
+ import { SkyDropdownMessageType, SkyDropdownModule } from '@skyux/popovers';
24
+
25
+ /**
26
+ * NOTICE: DO NOT MODIFY THIS FILE!
27
+ * The contents of this file were automatically generated by
28
+ * the 'ng generate @skyux/i18n:lib-resources-module lib/modules/shared/sky-lists' schematic.
29
+ * To update this file, simply rerun the command.
30
+ */
31
+ const RESOURCES = {
32
+ 'EN-US': {
33
+ skyux_filter_button_title: { message: 'Filter' },
34
+ skyux_filter_summary_close: { message: 'Remove filter' },
35
+ skyux_filter_summary_header: { message: 'Filter' },
36
+ skyux_infinite_scroll_load_more_button: { message: 'Load more' },
37
+ skyux_paging_label: { message: 'Pagination' },
38
+ skyux_paging_next: { message: 'Next' },
39
+ skyux_paging_page_link_aria_label: { message: 'Page {0}' },
40
+ skyux_paging_previous: { message: 'Previous' },
41
+ skyux_repeater_label: { message: 'List of items' },
42
+ skyux_repeater_item_expand: { message: 'Expand or collapse {0}' },
43
+ skyux_repeater_item_expand_default: { message: 'Expand or collapse' },
44
+ skyux_repeater_item_checkbox_label: { message: 'Select {0}' },
45
+ skyux_repeater_item_checkbox_label_default: { message: 'Select row' },
46
+ skyux_repeater_item_reorder_cancel: {
47
+ message: 'Item reordering was canceled. The item was returned to its original position.',
48
+ },
49
+ skyux_repeater_item_reorder_finish: {
50
+ message: 'Dropped the item in position',
51
+ },
52
+ skyux_repeater_item_reorder_instructions: {
53
+ message: 'Item grabbed. Press the up and down arrow keys to change position. Press the spacebar or enter key to drop. And press the escape key to cancel.',
54
+ },
55
+ skyux_repeater_item_reorder_moved: {
56
+ message: 'Moved the item to position',
57
+ },
58
+ skyux_repeater_item_reorder_label_default: { message: 'Reorder' },
59
+ skyux_repeater_item_reorder_label: { message: 'Reorder {0}' },
60
+ skyux_repeater_item_reorder_operation: {
61
+ message: 'Press the spacebar or enter key to reorder.',
62
+ },
63
+ skyux_repeater_item_reorder_top: { message: 'Top' },
64
+ skyux_repeater_item_reorder_top_label: { message: 'Move {0} to top' },
65
+ skyux_repeater_item_reorder_top_label_default: { message: 'Move to top' },
66
+ skyux_sort_button_label: { message: 'Sort' },
67
+ skyux_sort_menu_heading: { message: 'Sort by' },
68
+ },
69
+ };
70
+ class SkyListsResourcesProvider {
71
+ getString(localeInfo, name) {
72
+ return getLibStringForLocale(RESOURCES, localeInfo.locale, name);
73
+ }
74
+ }
75
+ /**
76
+ * Import into any component library module that needs to use resource strings.
77
+ */
78
+ class SkyListsResourcesModule {
79
+ }
80
+ SkyListsResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyListsResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
81
+ SkyListsResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyListsResourcesModule, exports: [SkyI18nModule] });
82
+ SkyListsResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyListsResourcesModule, providers: [
83
+ {
84
+ provide: SKY_LIB_RESOURCES_PROVIDERS,
85
+ useClass: SkyListsResourcesProvider,
86
+ multi: true,
87
+ },
88
+ ], imports: [SkyI18nModule] });
89
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyListsResourcesModule, decorators: [{
90
+ type: NgModule,
91
+ args: [{
92
+ exports: [SkyI18nModule],
93
+ providers: [
94
+ {
95
+ provide: SKY_LIB_RESOURCES_PROVIDERS,
96
+ useClass: SkyListsResourcesProvider,
97
+ multi: true,
98
+ },
99
+ ],
100
+ }]
101
+ }] });
102
+
103
+ let nextId = 0;
104
+ class SkyFilterButtonComponent {
105
+ constructor() {
106
+ /**
107
+ * Indicates whether to highlight the filter button to indicate that filters were applied.
108
+ * We recommend setting this property to `true` when no indication of filtering is visible
109
+ * to users. For example, set it to `true` if you do not display the filter summary.
110
+ */
111
+ this.active = false;
112
+ /**
113
+ * Indicates whether to disable the filter button.
114
+ */
115
+ this.disabled = false;
116
+ /**
117
+ * Indicates whether to display a **Filter** label beside the icon on the filter button.
118
+ */
119
+ this.showButtonText = false;
120
+ /**
121
+ * Fires when the filter button is selected.
122
+ */
123
+ this.filterButtonClick = new EventEmitter();
124
+ }
125
+ /**
126
+ * Specifies an ID for the filter button.
127
+ */
128
+ get filterButtonId() {
129
+ return this._filterButtonId || `sky-filter-button-${++nextId}`;
130
+ }
131
+ set filterButtonId(value) {
132
+ this._filterButtonId = value;
133
+ }
134
+ filterButtonOnClick() {
135
+ this.filterButtonClick.emit(undefined);
136
+ }
137
+ }
138
+ SkyFilterButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
139
+ SkyFilterButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyFilterButtonComponent, selector: "sky-filter-button", inputs: { filterButtonId: "filterButtonId", ariaControls: "ariaControls", ariaExpanded: "ariaExpanded", active: "active", disabled: "disabled", showButtonText: "showButtonText" }, outputs: { filterButtonClick: "filterButtonClick" }, ngImport: i0, template: "<button\n class=\"sky-btn sky-btn-default sky-filter-btn\"\n type=\"button\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-expanded]=\"ariaExpanded\"\n [attr.aria-label]=\"'skyux_filter_button_title' | skyLibResources\"\n [attr.title]=\"'skyux_filter_button_title' | skyLibResources\"\n [disabled]=\"disabled\"\n [id]=\"filterButtonId\"\n [ngClass]=\"{\n 'sky-filter-btn-active': active\n }\"\n [skyThemeClass]=\"{\n 'sky-rounded-corners': 'default',\n 'sky-theme-modern': 'modern'\n }\"\n (click)=\"filterButtonOnClick()\"\n>\n <sky-icon *skyThemeIf=\"'default'\" icon=\"filter\" size=\"lg\"> </sky-icon>\n <sky-icon *skyThemeIf=\"'modern'\" icon=\"filter\" iconType=\"skyux\"></sky-icon>\n <span *ngIf=\"showButtonText\" class=\"sky-filter-btn-text\">\n {{ 'skyux_filter_button_title' | skyLibResources }}\n </span>\n</button>\n", styles: [".sky-filter-btn-active,.sky-filter-btn-active:hover,.sky-filter-btn-active:focus{color:#72bf44;border:2px solid #72bf44;padding:5px 11px}.sky-filter-btn-active:hover,.sky-filter-btn-active:focus{color:#212327}.sky-theme-modern.sky-filter-btn-active,.sky-theme-modern.sky-filter-btn-active:hover,.sky-theme-modern.sky-filter-btn-active:focus{color:initial;border:none;box-shadow:inset 0 0 0 1px #0974a1;background-color:#c1e8fb;color:#212327;padding:9px 21px}.sky-theme-modern.sky-filter-btn-active:hover,.sky-theme-modern.sky-filter-btn-active:hover:hover,.sky-theme-modern.sky-filter-btn-active:focus:hover{border:none;box-shadow:inset 0 0 0 1px #0974a1;text-decoration:none}.sky-theme-modern.sky-filter-btn-active:hover,.sky-theme-modern.sky-filter-btn-active:active,.sky-theme-modern.sky-filter-btn-active.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover:hover,.sky-theme-modern.sky-filter-btn-active:hover:active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus:hover,.sky-theme-modern.sky-filter-btn-active:focus:active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-active{color:#212327}.sky-theme-modern.sky-filter-btn-active:active,.sky-theme-modern.sky-filter-btn-active.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover:active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus:active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-active{border:none;box-shadow:inset 0 0 0 2px #0974a1;background-image:none}.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled:hover,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled:focus,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled.sky-btn-focus,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled:active,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled.sky-btn-active,.sky-theme-modern.sky-filter-btn-active[disabled],.sky-theme-modern.sky-filter-btn-active[disabled]:hover,.sky-theme-modern.sky-filter-btn-active[disabled]:focus,.sky-theme-modern.sky-filter-btn-active[disabled].sky-btn-focus,.sky-theme-modern.sky-filter-btn-active[disabled]:active,.sky-theme-modern.sky-filter-btn-active[disabled].sky-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active.sky-btn-focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled:hover,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled:focus,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled.sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled:active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover[disabled],.sky-theme-modern.sky-filter-btn-active:hover[disabled]:hover,.sky-theme-modern.sky-filter-btn-active:hover[disabled]:focus,.sky-theme-modern.sky-filter-btn-active:hover[disabled].sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:hover[disabled]:active,.sky-theme-modern.sky-filter-btn-active:hover[disabled].sky-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover.sky-btn-focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover:active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled:hover,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled:focus,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled.sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled:active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus[disabled],.sky-theme-modern.sky-filter-btn-active:focus[disabled]:hover,.sky-theme-modern.sky-filter-btn-active:focus[disabled]:focus,.sky-theme-modern.sky-filter-btn-active:focus[disabled].sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:focus[disabled]:active,.sky-theme-modern.sky-filter-btn-active:focus[disabled].sky-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus.sky-btn-focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus:active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus.sky-btn-active{border:none;box-shadow:inset 0 0 0 1px #d2d2d2;background-color:#ededee;color:#686c73;opacity:1}.sky-theme-modern.sky-filter-btn-active:focus,.sky-theme-modern.sky-filter-btn-active:hover:focus,.sky-theme-modern.sky-filter-btn-active:focus:focus{outline:none}.sky-theme-modern.sky-filter-btn-active:focus:not(:active),.sky-theme-modern.sky-filter-btn-active:hover:focus:not(:active),.sky-theme-modern.sky-filter-btn-active:focus:focus:not(:active){border:none;box-shadow:inset 0 0 0 2px #0974a1,0 1px 8px #0000004d}:host .sky-filter-btn-text{display:none}:host .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:none}:host-context(.sky-responsive-container-xs) .sky-filter-btn-text,:host-context(.sky-responsive-container-sm) .sky-filter-btn-text,:host-context(.sky-responsive-container-md) .sky-filter-btn-text,:host-context(.sky-responsive-container-lg) .sky-filter-btn-text{display:none}:host-context(.sky-responsive-container-xs) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-sm) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-md) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-lg) .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:none}@media (min-width: 768px){:host .sky-filter-btn-text{display:inline}:host .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:inline-block}}:host-context(.sky-responsive-container-sm) .sky-filter-btn-text,:host-context(.sky-responsive-container-md) .sky-filter-btn-text,:host-context(.sky-responsive-container-lg) .sky-filter-btn-text{display:inline}:host-context(.sky-responsive-container-sm) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-md) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-lg) .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:inline-block}\n"], components: [{ type: i1.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { type: i3.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
140
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterButtonComponent, decorators: [{
141
+ type: Component,
142
+ args: [{ selector: 'sky-filter-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n class=\"sky-btn sky-btn-default sky-filter-btn\"\n type=\"button\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-expanded]=\"ariaExpanded\"\n [attr.aria-label]=\"'skyux_filter_button_title' | skyLibResources\"\n [attr.title]=\"'skyux_filter_button_title' | skyLibResources\"\n [disabled]=\"disabled\"\n [id]=\"filterButtonId\"\n [ngClass]=\"{\n 'sky-filter-btn-active': active\n }\"\n [skyThemeClass]=\"{\n 'sky-rounded-corners': 'default',\n 'sky-theme-modern': 'modern'\n }\"\n (click)=\"filterButtonOnClick()\"\n>\n <sky-icon *skyThemeIf=\"'default'\" icon=\"filter\" size=\"lg\"> </sky-icon>\n <sky-icon *skyThemeIf=\"'modern'\" icon=\"filter\" iconType=\"skyux\"></sky-icon>\n <span *ngIf=\"showButtonText\" class=\"sky-filter-btn-text\">\n {{ 'skyux_filter_button_title' | skyLibResources }}\n </span>\n</button>\n", styles: [".sky-filter-btn-active,.sky-filter-btn-active:hover,.sky-filter-btn-active:focus{color:#72bf44;border:2px solid #72bf44;padding:5px 11px}.sky-filter-btn-active:hover,.sky-filter-btn-active:focus{color:#212327}.sky-theme-modern.sky-filter-btn-active,.sky-theme-modern.sky-filter-btn-active:hover,.sky-theme-modern.sky-filter-btn-active:focus{color:initial;border:none;box-shadow:inset 0 0 0 1px #0974a1;background-color:#c1e8fb;color:#212327;padding:9px 21px}.sky-theme-modern.sky-filter-btn-active:hover,.sky-theme-modern.sky-filter-btn-active:hover:hover,.sky-theme-modern.sky-filter-btn-active:focus:hover{border:none;box-shadow:inset 0 0 0 1px #0974a1;text-decoration:none}.sky-theme-modern.sky-filter-btn-active:hover,.sky-theme-modern.sky-filter-btn-active:active,.sky-theme-modern.sky-filter-btn-active.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover:hover,.sky-theme-modern.sky-filter-btn-active:hover:active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus:hover,.sky-theme-modern.sky-filter-btn-active:focus:active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-active{color:#212327}.sky-theme-modern.sky-filter-btn-active:active,.sky-theme-modern.sky-filter-btn-active.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover:active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus:active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-active{border:none;box-shadow:inset 0 0 0 2px #0974a1;background-image:none}.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled:hover,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled:focus,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled.sky-btn-focus,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled:active,.sky-theme-modern.sky-filter-btn-active.sky-btn-disabled.sky-btn-active,.sky-theme-modern.sky-filter-btn-active[disabled],.sky-theme-modern.sky-filter-btn-active[disabled]:hover,.sky-theme-modern.sky-filter-btn-active[disabled]:focus,.sky-theme-modern.sky-filter-btn-active[disabled].sky-btn-focus,.sky-theme-modern.sky-filter-btn-active[disabled]:active,.sky-theme-modern.sky-filter-btn-active[disabled].sky-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active.sky-btn-focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled:hover,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled:focus,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled.sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled:active,.sky-theme-modern.sky-filter-btn-active:hover.sky-btn-disabled.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:hover[disabled],.sky-theme-modern.sky-filter-btn-active:hover[disabled]:hover,.sky-theme-modern.sky-filter-btn-active:hover[disabled]:focus,.sky-theme-modern.sky-filter-btn-active:hover[disabled].sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:hover[disabled]:active,.sky-theme-modern.sky-filter-btn-active:hover[disabled].sky-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover.sky-btn-focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover:active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:hover.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled:hover,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled:focus,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled.sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled:active,.sky-theme-modern.sky-filter-btn-active:focus.sky-btn-disabled.sky-btn-active,.sky-theme-modern.sky-filter-btn-active:focus[disabled],.sky-theme-modern.sky-filter-btn-active:focus[disabled]:hover,.sky-theme-modern.sky-filter-btn-active:focus[disabled]:focus,.sky-theme-modern.sky-filter-btn-active:focus[disabled].sky-btn-focus,.sky-theme-modern.sky-filter-btn-active:focus[disabled]:active,.sky-theme-modern.sky-filter-btn-active:focus[disabled].sky-btn-active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus:hover,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus:focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus.sky-btn-focus,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus:active,fieldset[disabled] .sky-theme-modern.sky-filter-btn-active:focus.sky-btn-active{border:none;box-shadow:inset 0 0 0 1px #d2d2d2;background-color:#ededee;color:#686c73;opacity:1}.sky-theme-modern.sky-filter-btn-active:focus,.sky-theme-modern.sky-filter-btn-active:hover:focus,.sky-theme-modern.sky-filter-btn-active:focus:focus{outline:none}.sky-theme-modern.sky-filter-btn-active:focus:not(:active),.sky-theme-modern.sky-filter-btn-active:hover:focus:not(:active),.sky-theme-modern.sky-filter-btn-active:focus:focus:not(:active){border:none;box-shadow:inset 0 0 0 2px #0974a1,0 1px 8px #0000004d}:host .sky-filter-btn-text{display:none}:host .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:none}:host-context(.sky-responsive-container-xs) .sky-filter-btn-text,:host-context(.sky-responsive-container-sm) .sky-filter-btn-text,:host-context(.sky-responsive-container-md) .sky-filter-btn-text,:host-context(.sky-responsive-container-lg) .sky-filter-btn-text{display:none}:host-context(.sky-responsive-container-xs) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-sm) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-md) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-lg) .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:none}@media (min-width: 768px){:host .sky-filter-btn-text{display:inline}:host .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:inline-block}}:host-context(.sky-responsive-container-sm) .sky-filter-btn-text,:host-context(.sky-responsive-container-md) .sky-filter-btn-text,:host-context(.sky-responsive-container-lg) .sky-filter-btn-text{display:inline}:host-context(.sky-responsive-container-sm) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-md) .sky-filter-btn ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-lg) .sky-filter-btn ::ng-deep .sky-dropdown-caret{display:inline-block}\n"] }]
143
+ }], propDecorators: { filterButtonId: [{
144
+ type: Input
145
+ }], ariaControls: [{
146
+ type: Input
147
+ }], ariaExpanded: [{
148
+ type: Input
149
+ }], active: [{
150
+ type: Input
151
+ }], disabled: [{
152
+ type: Input
153
+ }], showButtonText: [{
154
+ type: Input
155
+ }], filterButtonClick: [{
156
+ type: Output
157
+ }] } });
158
+
159
+ /**
160
+ * Specifies an inline filter.
161
+ */
162
+ class SkyFilterInlineItemComponent {
163
+ }
164
+ SkyFilterInlineItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterInlineItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
165
+ SkyFilterInlineItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyFilterInlineItemComponent, selector: "sky-filter-inline-item", ngImport: i0, template: "<div class=\"sky-filter-inline-item\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-filter-inline-item{margin-right:10px}\n"] });
166
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterInlineItemComponent, decorators: [{
167
+ type: Component,
168
+ args: [{ selector: 'sky-filter-inline-item', template: "<div class=\"sky-filter-inline-item\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-filter-inline-item{margin-right:10px}\n"] }]
169
+ }] });
170
+
171
+ /**
172
+ * Specifies a wrapper for the inline filters.
173
+ */
174
+ class SkyFilterInlineComponent {
175
+ }
176
+ SkyFilterInlineComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterInlineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
177
+ SkyFilterInlineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyFilterInlineComponent, selector: "sky-filter-inline", ngImport: i0, template: "<div class=\"sky-filter-inline sky-padding-even-default\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-filter-inline{background-color:#eeeeef;display:flex;align-items:center}\n"] });
178
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterInlineComponent, decorators: [{
179
+ type: Component,
180
+ args: [{ selector: 'sky-filter-inline', template: "<div class=\"sky-filter-inline sky-padding-even-default\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-filter-inline{background-color:#eeeeef;display:flex;align-items:center}\n"] }]
181
+ }] });
182
+
183
+ /**
184
+ * Specifies a filter that was applied.
185
+ */
186
+ class SkyFilterSummaryItemComponent {
187
+ constructor() {
188
+ /**
189
+ * Indicates whether the filter summary item has a close button.
190
+ */
191
+ this.dismissible = true;
192
+ /**
193
+ * Fires when the summary item close button is selected.
194
+ */
195
+ this.dismiss = new EventEmitter();
196
+ /**
197
+ * Fires when the summary item is selected.
198
+ */
199
+ this.itemClick = new EventEmitter();
200
+ }
201
+ onItemDismiss() {
202
+ this.dismiss.emit();
203
+ }
204
+ onItemClick() {
205
+ this.itemClick.emit();
206
+ }
207
+ onItemKeypress() {
208
+ this.itemClick.emit();
209
+ }
210
+ }
211
+ SkyFilterSummaryItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterSummaryItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
212
+ SkyFilterSummaryItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyFilterSummaryItemComponent, selector: "sky-filter-summary-item", inputs: { dismissible: "dismissible" }, outputs: { dismiss: "dismiss", itemClick: "itemClick" }, ngImport: i0, template: "<div\n class=\"sky-filter-summary-item\"\n (click)=\"onItemClick()\"\n (keypress.enter)=\"onItemKeypress()\"\n>\n <sky-token\n [ariaLabel]=\"'skyux_filter_summary_close' | skyLibResources\"\n [dismissible]=\"dismissible\"\n (dismiss)=\"onItemDismiss()\"\n >\n <ng-content> </ng-content>\n </sky-token>\n</div>\n", styles: [".sky-filter-summary-item{display:inline-block}:host:not(:last-child){margin-right:5px}:host-context(.sky-theme-modern) .sky-filter-summary-item{padding:0 0 5px}.sky-theme-modern .sky-filter-summary-item{padding:0 0 5px}\n"], components: [{ type: i1.λ12, selector: "sky-token", inputs: ["disabled", "ariaLabel", "dismissible", "focusable"], outputs: ["dismiss", "tokenFocus"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
213
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterSummaryItemComponent, decorators: [{
214
+ type: Component,
215
+ args: [{ selector: 'sky-filter-summary-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"sky-filter-summary-item\"\n (click)=\"onItemClick()\"\n (keypress.enter)=\"onItemKeypress()\"\n>\n <sky-token\n [ariaLabel]=\"'skyux_filter_summary_close' | skyLibResources\"\n [dismissible]=\"dismissible\"\n (dismiss)=\"onItemDismiss()\"\n >\n <ng-content> </ng-content>\n </sky-token>\n</div>\n", styles: [".sky-filter-summary-item{display:inline-block}:host:not(:last-child){margin-right:5px}:host-context(.sky-theme-modern) .sky-filter-summary-item{padding:0 0 5px}.sky-theme-modern .sky-filter-summary-item{padding:0 0 5px}\n"] }]
216
+ }], propDecorators: { dismissible: [{
217
+ type: Input
218
+ }], dismiss: [{
219
+ type: Output
220
+ }], itemClick: [{
221
+ type: Output
222
+ }] } });
223
+
224
+ /**
225
+ * Specifies a wrapper for the filters that were applied.
226
+ */
227
+ class SkyFilterSummaryComponent {
228
+ }
229
+ SkyFilterSummaryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
230
+ SkyFilterSummaryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyFilterSummaryComponent, selector: "sky-filter-summary", ngImport: i0, template: "<div class=\"sky-filter-summary\">\n <span class=\"sky-filter-summary-header\"\n >{{ 'skyux_filter_summary_header' | skyLibResources }}:</span\n >\n <div class=\"sky-filter-summary-items\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [".sky-filter-summary-header{margin:5px 10px 0 0;font-weight:600}.sky-filter-summary{background-color:#fff;overflow-x:auto;display:flex;align-items:flex-start}.sky-filter-summary-items{display:flex;flex-wrap:wrap}:host-context(.sky-theme-modern) .sky-filter-summary-header{margin:0 10px 0 0}.sky-theme-modern .sky-filter-summary-header{margin:0 10px 0 0}\n"], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
231
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterSummaryComponent, decorators: [{
232
+ type: Component,
233
+ args: [{ selector: 'sky-filter-summary', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-filter-summary\">\n <span class=\"sky-filter-summary-header\"\n >{{ 'skyux_filter_summary_header' | skyLibResources }}:</span\n >\n <div class=\"sky-filter-summary-items\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [".sky-filter-summary-header{margin:5px 10px 0 0;font-weight:600}.sky-filter-summary{background-color:#fff;overflow-x:auto;display:flex;align-items:flex-start}.sky-filter-summary-items{display:flex;flex-wrap:wrap}:host-context(.sky-theme-modern) .sky-filter-summary-header{margin:0 10px 0 0}.sky-theme-modern .sky-filter-summary-header{margin:0 10px 0 0}\n"] }]
234
+ }] });
235
+
236
+ class SkyFilterModule {
237
+ }
238
+ SkyFilterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
239
+ SkyFilterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterModule, declarations: [SkyFilterButtonComponent,
240
+ SkyFilterInlineComponent,
241
+ SkyFilterInlineItemComponent,
242
+ SkyFilterSummaryComponent,
243
+ SkyFilterSummaryItemComponent], imports: [CommonModule,
244
+ SkyIconModule,
245
+ SkyListsResourcesModule,
246
+ SkyTokensModule,
247
+ SkyThemeModule], exports: [SkyFilterButtonComponent,
248
+ SkyFilterInlineComponent,
249
+ SkyFilterInlineItemComponent,
250
+ SkyFilterSummaryComponent,
251
+ SkyFilterSummaryItemComponent] });
252
+ SkyFilterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterModule, imports: [[
253
+ CommonModule,
254
+ SkyIconModule,
255
+ SkyListsResourcesModule,
256
+ SkyTokensModule,
257
+ SkyThemeModule,
258
+ ]] });
259
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyFilterModule, decorators: [{
260
+ type: NgModule,
261
+ args: [{
262
+ declarations: [
263
+ SkyFilterButtonComponent,
264
+ SkyFilterInlineComponent,
265
+ SkyFilterInlineItemComponent,
266
+ SkyFilterSummaryComponent,
267
+ SkyFilterSummaryItemComponent,
268
+ ],
269
+ imports: [
270
+ CommonModule,
271
+ SkyIconModule,
272
+ SkyListsResourcesModule,
273
+ SkyTokensModule,
274
+ SkyThemeModule,
275
+ ],
276
+ exports: [
277
+ SkyFilterButtonComponent,
278
+ SkyFilterInlineComponent,
279
+ SkyFilterInlineItemComponent,
280
+ SkyFilterSummaryComponent,
281
+ SkyFilterSummaryItemComponent,
282
+ ],
283
+ }]
284
+ }] });
285
+
286
+ /**
287
+ * @internal
288
+ */
289
+ class SkyInfiniteScrollDomAdapterService {
290
+ constructor(windowRef) {
291
+ this.windowRef = windowRef;
292
+ this.ngUnsubscribe = new Subject();
293
+ this._parentChanges = new EventEmitter();
294
+ }
295
+ ngOnDestroy() {
296
+ this._parentChanges.complete();
297
+ this.ngUnsubscribe.next();
298
+ this.ngUnsubscribe.complete();
299
+ }
300
+ /**
301
+ * This event is triggered when child nodes are added to the infinite
302
+ * scroll parent container. e.g., A repeating list of elements was added.
303
+ * @param elementRef The infinite scroll element reference.
304
+ */
305
+ parentChanges(elementRef) {
306
+ this.createObserver(elementRef.nativeElement);
307
+ return this._parentChanges;
308
+ }
309
+ /**
310
+ * This event is triggered when the provided element reference
311
+ * is visible (or scrolled to) within its scrollable parent container.
312
+ * @param elementRef The infinite scroll element reference.
313
+ */
314
+ scrollTo(elementRef) {
315
+ const parent = this.findScrollableParent(elementRef.nativeElement);
316
+ return fromEvent(parent, 'scroll').pipe(takeUntil(this.ngUnsubscribe), filter(() => {
317
+ return this.isElementScrolledInView(elementRef.nativeElement, parent);
318
+ }), map(() => undefined) // Change to void return type
319
+ );
320
+ }
321
+ createObserver(element) {
322
+ this.observer = new MutationObserver((mutations) => {
323
+ const hasUpdates = !!mutations.find((mutation) => {
324
+ return (!element.contains(mutation.target) && mutation.addedNodes.length > 0);
325
+ });
326
+ if (hasUpdates) {
327
+ this._parentChanges.emit();
328
+ }
329
+ });
330
+ const windowObj = this.windowRef.nativeWindow;
331
+ const parent = this.findScrollableParent(element);
332
+ const observedParent = parent === windowObj ? windowObj.document.body : parent;
333
+ this.observer.observe(observedParent, {
334
+ childList: true,
335
+ subtree: true,
336
+ });
337
+ }
338
+ findScrollableParent(element) {
339
+ const regex = /(auto|scroll)/;
340
+ const windowObj = this.windowRef.nativeWindow;
341
+ const bodyObj = windowObj.document.body;
342
+ let style = windowObj.getComputedStyle(element);
343
+ let parent = element;
344
+ do {
345
+ parent = parent.parentNode;
346
+ style = windowObj.getComputedStyle(parent);
347
+ } while (!regex.test(style.overflow) &&
348
+ !regex.test(style.overflowY) &&
349
+ parent.parentNode &&
350
+ parent !== bodyObj);
351
+ if (parent === bodyObj) {
352
+ return windowObj;
353
+ }
354
+ return parent;
355
+ }
356
+ isElementScrolledInView(element, parentElement) {
357
+ const windowObj = this.windowRef.nativeWindow;
358
+ if (parentElement === windowObj) {
359
+ return (parentElement.pageYOffset + parentElement.innerHeight >
360
+ element.offsetTop);
361
+ }
362
+ const elementRect = element.getBoundingClientRect();
363
+ const parentRect = parentElement.getBoundingClientRect();
364
+ return elementRect.top < parentRect.top + parentRect.height;
365
+ }
366
+ }
367
+ SkyInfiniteScrollDomAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyInfiniteScrollDomAdapterService, deps: [{ token: i1$1.SkyAppWindowRef }], target: i0.ɵɵFactoryTarget.Injectable });
368
+ SkyInfiniteScrollDomAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyInfiniteScrollDomAdapterService });
369
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyInfiniteScrollDomAdapterService, decorators: [{
370
+ type: Injectable
371
+ }], ctorParameters: function () { return [{ type: i1$1.SkyAppWindowRef }]; } });
372
+
373
+ class SkyInfiniteScrollComponent {
374
+ constructor(changeDetector, elementRef, domAdapter) {
375
+ this.changeDetector = changeDetector;
376
+ this.elementRef = elementRef;
377
+ this.domAdapter = domAdapter;
378
+ /**
379
+ * Fires when scrolling triggers the need to load more data or when users select the button
380
+ * to load more data. This event only fires when the `enabled` property is set to `true`
381
+ * and data is not already loading.
382
+ */
383
+ this.scrollEnd = new EventEmitter();
384
+ this.isWaiting = false;
385
+ this.ngUnsubscribe = new Subject();
386
+ }
387
+ /**
388
+ * Indicates whether to make the infinite scroll component active when more data is available
389
+ * to load. By default, infinite scroll is inactive and does not call the load function.
390
+ * @default false
391
+ */
392
+ get enabled() {
393
+ return this._enabled || false;
394
+ }
395
+ set enabled(value) {
396
+ if (this._enabled !== value) {
397
+ this._enabled = value;
398
+ this.setListeners();
399
+ }
400
+ }
401
+ /**
402
+ * Indicates whether data is loading because of a `scrollEnd` event. Setting the property
403
+ * to `true` disables new `scrollEnd` events from firing until it changes to `false`. If this
404
+ * property is not specified, the infinite scroll component watches the DOM for changes
405
+ * and fires `scrollEnd` events when changes occur on its parent DOM element. Relying
406
+ * on this default behavior could fire an excessive number of `scrollEnd` events
407
+ * if the DOM changes are not related to loading data, so we strongly recommend using this
408
+ * property to explicitly set the infinite scroll's loading state.
409
+ * @required
410
+ */
411
+ get loading() {
412
+ return this._loading;
413
+ }
414
+ set loading(value) {
415
+ this._loading = value;
416
+ if (value !== undefined) {
417
+ this.isWaiting = value;
418
+ }
419
+ }
420
+ ngOnDestroy() {
421
+ this.enabled = false;
422
+ this.ngUnsubscribe.next();
423
+ this.ngUnsubscribe.complete();
424
+ }
425
+ startInfiniteScrollLoad() {
426
+ this.notifyScrollEnd();
427
+ }
428
+ notifyScrollEnd() {
429
+ this.isWaiting = true;
430
+ this.scrollEnd.emit();
431
+ this.changeDetector.markForCheck();
432
+ }
433
+ setListeners() {
434
+ if (this.enabled) {
435
+ // The user has scrolled to the infinite scroll element.
436
+ this.domAdapter
437
+ .scrollTo(this.elementRef)
438
+ .pipe(takeUntil(this.ngUnsubscribe))
439
+ .subscribe(() => {
440
+ if (!this.isWaiting && this.enabled) {
441
+ this.notifyScrollEnd();
442
+ }
443
+ });
444
+ // New items have been loaded into the parent element.
445
+ this.domAdapter
446
+ .parentChanges(this.elementRef)
447
+ .pipe(takeUntil(this.ngUnsubscribe))
448
+ .subscribe(() => {
449
+ if (!this.loading) {
450
+ this.isWaiting = false;
451
+ this.changeDetector.markForCheck();
452
+ }
453
+ });
454
+ }
455
+ else {
456
+ this.ngUnsubscribe.next();
457
+ }
458
+ }
459
+ }
460
+ SkyInfiniteScrollComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyInfiniteScrollComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: SkyInfiniteScrollDomAdapterService }], target: i0.ɵɵFactoryTarget.Component });
461
+ SkyInfiniteScrollComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyInfiniteScrollComponent, selector: "sky-infinite-scroll", inputs: { enabled: "enabled", loading: "loading" }, outputs: { scrollEnd: "scrollEnd" }, providers: [SkyInfiniteScrollDomAdapterService], ngImport: i0, template: "<div *ngIf=\"enabled\" class=\"sky-infinite-scroll\">\n <button\n *ngIf=\"!isWaiting && enabled\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"startInfiniteScrollLoad()\"\n >\n {{ 'skyux_infinite_scroll_load_more_button' | skyLibResources }}\n </button>\n <sky-wait [isWaiting]=\"isWaiting\"> </sky-wait>\n</div>\n", styles: [".sky-infinite-scroll{margin-top:20px;text-align:center;min-height:75px}\n"], components: [{ type: i1.λ14, selector: "sky-wait", inputs: ["ariaLabel", "isWaiting", "isFullPage", "isNonBlocking"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
462
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyInfiniteScrollComponent, decorators: [{
463
+ type: Component,
464
+ args: [{ selector: 'sky-infinite-scroll', changeDetection: ChangeDetectionStrategy.OnPush, providers: [SkyInfiniteScrollDomAdapterService], template: "<div *ngIf=\"enabled\" class=\"sky-infinite-scroll\">\n <button\n *ngIf=\"!isWaiting && enabled\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"startInfiniteScrollLoad()\"\n >\n {{ 'skyux_infinite_scroll_load_more_button' | skyLibResources }}\n </button>\n <sky-wait [isWaiting]=\"isWaiting\"> </sky-wait>\n</div>\n", styles: [".sky-infinite-scroll{margin-top:20px;text-align:center;min-height:75px}\n"] }]
465
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: SkyInfiniteScrollDomAdapterService }]; }, propDecorators: { enabled: [{
466
+ type: Input
467
+ }], loading: [{
468
+ type: Input
469
+ }], scrollEnd: [{
470
+ type: Output
471
+ }] } });
472
+
473
+ class SkyInfiniteScrollModule {
474
+ }
475
+ SkyInfiniteScrollModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyInfiniteScrollModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
476
+ SkyInfiniteScrollModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyInfiniteScrollModule, declarations: [SkyInfiniteScrollComponent], imports: [CommonModule, SkyListsResourcesModule, SkyWaitModule], exports: [SkyInfiniteScrollComponent] });
477
+ SkyInfiniteScrollModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyInfiniteScrollModule, imports: [[CommonModule, SkyListsResourcesModule, SkyWaitModule]] });
478
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyInfiniteScrollModule, decorators: [{
479
+ type: NgModule,
480
+ args: [{
481
+ declarations: [SkyInfiniteScrollComponent],
482
+ imports: [CommonModule, SkyListsResourcesModule, SkyWaitModule],
483
+ exports: [SkyInfiniteScrollComponent],
484
+ }]
485
+ }] });
486
+
487
+ class SkyPagingComponent {
488
+ constructor() {
489
+ /**
490
+ * Specifies the page number of the current page. Page numbers start at 1 and increment.
491
+ */
492
+ this.currentPage = 1;
493
+ /**
494
+ * Specifies the total number of items across all pages.
495
+ */
496
+ this.itemCount = 0;
497
+ /**
498
+ * Specifies the maximum number of pages to display in the pagination control.
499
+ */
500
+ this.maxPages = 5;
501
+ /**
502
+ * Specifies the number of items to display per page.
503
+ */
504
+ this.pageSize = 10;
505
+ /**
506
+ * Fires when the current page changes and emits the new current page.
507
+ */
508
+ this.currentPageChange = new EventEmitter();
509
+ this.displayedPages = [];
510
+ this.pageCount = 0;
511
+ }
512
+ ngOnChanges(changes) {
513
+ this.setPage(this.currentPage);
514
+ }
515
+ setPage(pageNumber) {
516
+ const previousPage = this.currentPage;
517
+ this.setPageCount();
518
+ if (pageNumber < 1 || this.pageCount < 1) {
519
+ this.currentPage = 1;
520
+ }
521
+ else if (pageNumber > this.pageCount) {
522
+ this.currentPage = this.pageCount;
523
+ }
524
+ else {
525
+ this.currentPage = pageNumber;
526
+ }
527
+ this.setDisplayedPages();
528
+ if (previousPage !== this.currentPage) {
529
+ this.currentPageChange.emit(this.currentPage);
530
+ }
531
+ }
532
+ nextPage() {
533
+ this.setPage(this.currentPage + 1);
534
+ }
535
+ previousPage() {
536
+ this.setPage(this.currentPage - 1);
537
+ }
538
+ get isPreviousButtonDisabled() {
539
+ return this.currentPage === 1;
540
+ }
541
+ get isNextButtonDisabled() {
542
+ return this.currentPage === this.pageCount;
543
+ }
544
+ getDisplayedPageNumbers(pageCount, maxDisplayedPages, pageNumber) {
545
+ const pageIndex = pageNumber - 1;
546
+ const pageBounds = Math.floor(maxDisplayedPages / 2);
547
+ let upperBound = pageIndex + pageBounds;
548
+ let lowerBound = pageIndex - pageBounds;
549
+ if (maxDisplayedPages % 2 !== 0) {
550
+ upperBound += 1;
551
+ }
552
+ // Wrap negative values to increase the upperbound
553
+ if (lowerBound < 0) {
554
+ upperBound -= lowerBound;
555
+ lowerBound = 0;
556
+ }
557
+ // Wrap overflow to decrease the lowerbound
558
+ if (upperBound > pageCount) {
559
+ lowerBound -= upperBound - pageCount;
560
+ upperBound = pageCount;
561
+ }
562
+ // If both are the same ignore everything else and just display it all
563
+ if (pageCount < maxDisplayedPages) {
564
+ lowerBound = 0;
565
+ upperBound = pageCount;
566
+ }
567
+ const displayedPageNumbers = [];
568
+ for (let i = lowerBound; i < upperBound; i++) {
569
+ displayedPageNumbers.push(i + 1);
570
+ }
571
+ return displayedPageNumbers;
572
+ }
573
+ setPageCount() {
574
+ if (this.itemCount === 0 || this.pageSize === 0) {
575
+ this.pageCount = 0;
576
+ return;
577
+ }
578
+ this.pageCount = Math.ceil(this.itemCount / this.pageSize);
579
+ }
580
+ setDisplayedPages() {
581
+ this.displayedPages = this.getDisplayedPageNumbers(this.pageCount, this.maxPages, this.currentPage);
582
+ }
583
+ }
584
+ SkyPagingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyPagingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
585
+ SkyPagingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyPagingComponent, selector: "sky-paging", inputs: { currentPage: "currentPage", itemCount: "itemCount", maxPages: "maxPages", pageSize: "pageSize", pagingLabel: "pagingLabel" }, outputs: { currentPageChange: "currentPageChange" }, usesOnChanges: true, ngImport: i0, template: "<nav\n *ngIf=\"pageCount > 1\"\n class=\"sky-paging\"\n [attr.aria-label]=\"pagingLabel || ('skyux_paging_label' | skyLibResources)\"\n>\n <ul>\n <li>\n <button\n class=\"sky-btn sky-btn-default sky-paging-btn sky-paging-btn-previous sky-box\"\n sky-cmp-id=\"previous\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_paging_previous' | skyLibResources\"\n [disabled]=\"isPreviousButtonDisabled\"\n (click)=\"previousPage()\"\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"caret-left\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"chevron-left\"\n iconType=\"skyux\"\n ></sky-icon>\n </button>\n </li>\n <li *ngFor=\"let pageNumber of displayedPages\" class=\"sky-list-paging-link\">\n <button\n class=\"sky-btn sky-btn-default sky-paging-btn sky-box\"\n type=\"button\"\n [attr.aria-current]=\"currentPage === pageNumber ? 'page' : null\"\n [attr.sky-cmp-id]=\"pageNumber\"\n [attr.aria-label]=\"\n 'skyux_paging_page_link_aria_label' | skyLibResources: pageNumber\n \"\n [disabled]=\"currentPage === pageNumber\"\n [ngClass]=\"{ 'sky-paging-current': currentPage === pageNumber }\"\n (click)=\"setPage(pageNumber)\"\n >\n {{ pageNumber }}\n </button>\n </li>\n <li>\n <button\n class=\"sky-btn sky-btn-default sky-paging-btn sky-paging-btn-next sky-box\"\n sky-cmp-id=\"next\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_paging_next' | skyLibResources\"\n [disabled]=\"isNextButtonDisabled\"\n (click)=\"nextPage()\"\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"caret-right\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"chevron-right\"\n iconType=\"skyux\"\n ></sky-icon>\n </button>\n </li>\n </ul>\n</nav>\n", styles: [":host{display:block}ul{margin:15px 0 0;display:inline-block;padding-left:0;border-radius:4px}li{display:inline}.sky-paging-btn{border-top:1px solid #e2e3e4;border-right:1px solid #e2e3e4;border-bottom:1px solid #e2e3e4;border-left:1px solid #e2e3e4;border-radius:0;background-color:#fff;color:inherit;float:left;margin-left:-1px;padding:4px 10px;text-decoration:none;line-height:1.428571429;font-size:15px;cursor:pointer}.sky-paging-btn.sky-paging-caret{transform:none}.sky-paging-btn.sky-paging-current,.sky-paging-btn.sky-paging-current:disabled,.sky-paging-btn.sky-paging-current[disabled]{background-color:#eeeeef;cursor:default;color:inherit;opacity:1}.sky-paging-btn:hover{background-color:#d4d4d6}.sky-paging-btn:disabled{color:#686c73;cursor:not-allowed;pointer-events:none}.sky-paging-btn.sky-paging-btn-previous,.sky-paging-btn.sky-paging-btn-next{padding-left:8.5px;padding-right:8.5px}:host-context(.sky-theme-modern) .sky-paging-btn{background-color:transparent;border:none;box-shadow:none;border-radius:6px;margin-right:10px;padding:3px 10px}:host-context(.sky-theme-modern) .sky-paging-btn:hover{background-color:transparent;border:solid 1px #1870B8;padding:2px 9px;z-index:1}:host-context(.sky-theme-modern) .sky-paging-btn:active,:host-context(.sky-theme-modern) .sky-paging-btn:focus{border:solid 2px #1870B8;color:#212327;padding:1px 8px}:host-context(.sky-theme-modern) .sky-paging-btn:focus:not(:active){outline:none;box-shadow:0 1px 3px #0000004d}:host-context(.sky-theme-modern) .sky-paging-current{background-color:#c1e8fb;border:solid 1px #1870B8;padding:2px 9px}.sky-theme-modern .sky-paging-btn{background-color:transparent;border:none;box-shadow:none;border-radius:6px;margin-right:10px;padding:3px 10px}.sky-theme-modern .sky-paging-btn:hover{background-color:transparent;border:solid 1px #1870B8;padding:2px 9px;z-index:1}.sky-theme-modern .sky-paging-btn:active,.sky-theme-modern .sky-paging-btn:focus{border:solid 2px #1870B8;color:#212327;padding:1px 8px}.sky-theme-modern .sky-paging-btn:focus:not(:active){outline:none;box-shadow:0 1px 3px #0000004d}.sky-theme-modern .sky-paging-current{background-color:#c1e8fb;border:solid 1px #1870B8;padding:2px 9px}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-paging-btn:active,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-paging-btn:focus{color:#fbfcfe}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-paging-current{background-color:#1870b8}.sky-theme-modern.sky-theme-mode-dark .sky-paging-btn:active,.sky-theme-modern.sky-theme-mode-dark .sky-paging-btn:focus{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark .sky-paging-current{background-color:#1870b8}\n"], components: [{ type: i1.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
586
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyPagingComponent, decorators: [{
587
+ type: Component,
588
+ args: [{ selector: 'sky-paging', changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav\n *ngIf=\"pageCount > 1\"\n class=\"sky-paging\"\n [attr.aria-label]=\"pagingLabel || ('skyux_paging_label' | skyLibResources)\"\n>\n <ul>\n <li>\n <button\n class=\"sky-btn sky-btn-default sky-paging-btn sky-paging-btn-previous sky-box\"\n sky-cmp-id=\"previous\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_paging_previous' | skyLibResources\"\n [disabled]=\"isPreviousButtonDisabled\"\n (click)=\"previousPage()\"\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"caret-left\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"chevron-left\"\n iconType=\"skyux\"\n ></sky-icon>\n </button>\n </li>\n <li *ngFor=\"let pageNumber of displayedPages\" class=\"sky-list-paging-link\">\n <button\n class=\"sky-btn sky-btn-default sky-paging-btn sky-box\"\n type=\"button\"\n [attr.aria-current]=\"currentPage === pageNumber ? 'page' : null\"\n [attr.sky-cmp-id]=\"pageNumber\"\n [attr.aria-label]=\"\n 'skyux_paging_page_link_aria_label' | skyLibResources: pageNumber\n \"\n [disabled]=\"currentPage === pageNumber\"\n [ngClass]=\"{ 'sky-paging-current': currentPage === pageNumber }\"\n (click)=\"setPage(pageNumber)\"\n >\n {{ pageNumber }}\n </button>\n </li>\n <li>\n <button\n class=\"sky-btn sky-btn-default sky-paging-btn sky-paging-btn-next sky-box\"\n sky-cmp-id=\"next\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_paging_next' | skyLibResources\"\n [disabled]=\"isNextButtonDisabled\"\n (click)=\"nextPage()\"\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"caret-right\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"chevron-right\"\n iconType=\"skyux\"\n ></sky-icon>\n </button>\n </li>\n </ul>\n</nav>\n", styles: [":host{display:block}ul{margin:15px 0 0;display:inline-block;padding-left:0;border-radius:4px}li{display:inline}.sky-paging-btn{border-top:1px solid #e2e3e4;border-right:1px solid #e2e3e4;border-bottom:1px solid #e2e3e4;border-left:1px solid #e2e3e4;border-radius:0;background-color:#fff;color:inherit;float:left;margin-left:-1px;padding:4px 10px;text-decoration:none;line-height:1.428571429;font-size:15px;cursor:pointer}.sky-paging-btn.sky-paging-caret{transform:none}.sky-paging-btn.sky-paging-current,.sky-paging-btn.sky-paging-current:disabled,.sky-paging-btn.sky-paging-current[disabled]{background-color:#eeeeef;cursor:default;color:inherit;opacity:1}.sky-paging-btn:hover{background-color:#d4d4d6}.sky-paging-btn:disabled{color:#686c73;cursor:not-allowed;pointer-events:none}.sky-paging-btn.sky-paging-btn-previous,.sky-paging-btn.sky-paging-btn-next{padding-left:8.5px;padding-right:8.5px}:host-context(.sky-theme-modern) .sky-paging-btn{background-color:transparent;border:none;box-shadow:none;border-radius:6px;margin-right:10px;padding:3px 10px}:host-context(.sky-theme-modern) .sky-paging-btn:hover{background-color:transparent;border:solid 1px #1870B8;padding:2px 9px;z-index:1}:host-context(.sky-theme-modern) .sky-paging-btn:active,:host-context(.sky-theme-modern) .sky-paging-btn:focus{border:solid 2px #1870B8;color:#212327;padding:1px 8px}:host-context(.sky-theme-modern) .sky-paging-btn:focus:not(:active){outline:none;box-shadow:0 1px 3px #0000004d}:host-context(.sky-theme-modern) .sky-paging-current{background-color:#c1e8fb;border:solid 1px #1870B8;padding:2px 9px}.sky-theme-modern .sky-paging-btn{background-color:transparent;border:none;box-shadow:none;border-radius:6px;margin-right:10px;padding:3px 10px}.sky-theme-modern .sky-paging-btn:hover{background-color:transparent;border:solid 1px #1870B8;padding:2px 9px;z-index:1}.sky-theme-modern .sky-paging-btn:active,.sky-theme-modern .sky-paging-btn:focus{border:solid 2px #1870B8;color:#212327;padding:1px 8px}.sky-theme-modern .sky-paging-btn:focus:not(:active){outline:none;box-shadow:0 1px 3px #0000004d}.sky-theme-modern .sky-paging-current{background-color:#c1e8fb;border:solid 1px #1870B8;padding:2px 9px}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-paging-btn:active,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-paging-btn:focus{color:#fbfcfe}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-paging-current{background-color:#1870b8}.sky-theme-modern.sky-theme-mode-dark .sky-paging-btn:active,.sky-theme-modern.sky-theme-mode-dark .sky-paging-btn:focus{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark .sky-paging-current{background-color:#1870b8}\n"] }]
589
+ }], propDecorators: { currentPage: [{
590
+ type: Input
591
+ }], itemCount: [{
592
+ type: Input
593
+ }], maxPages: [{
594
+ type: Input
595
+ }], pageSize: [{
596
+ type: Input
597
+ }], pagingLabel: [{
598
+ type: Input
599
+ }], currentPageChange: [{
600
+ type: Output
601
+ }] } });
602
+
603
+ class SkyPagingModule {
604
+ }
605
+ SkyPagingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyPagingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
606
+ SkyPagingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyPagingModule, declarations: [SkyPagingComponent], imports: [CommonModule,
607
+ SkyIconModule,
608
+ SkyListsResourcesModule,
609
+ SkyThemeModule], exports: [SkyPagingComponent] });
610
+ SkyPagingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyPagingModule, imports: [[
611
+ CommonModule,
612
+ SkyIconModule,
613
+ SkyListsResourcesModule,
614
+ SkyThemeModule,
615
+ ]] });
616
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyPagingModule, decorators: [{
617
+ type: NgModule,
618
+ args: [{
619
+ declarations: [SkyPagingComponent],
620
+ imports: [
621
+ CommonModule,
622
+ SkyIconModule,
623
+ SkyListsResourcesModule,
624
+ SkyThemeModule,
625
+ ],
626
+ exports: [SkyPagingComponent],
627
+ }]
628
+ }] });
629
+
630
+ /**
631
+ * Displays content text when the repeater is expanded.
632
+ */
633
+ class SkyRepeaterItemContentComponent {
634
+ }
635
+ SkyRepeaterItemContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterItemContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
636
+ SkyRepeaterItemContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyRepeaterItemContentComponent, selector: "sky-repeater-item-content", ngImport: i0, template: "<ng-content></ng-content>\n" });
637
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterItemContentComponent, decorators: [{
638
+ type: Component,
639
+ args: [{ selector: 'sky-repeater-item-content', template: "<ng-content></ng-content>\n" }]
640
+ }] });
641
+
642
+ /**
643
+ * Wraps and styles a
644
+ * [`skyux-dropdown` component](https://developer.blackbaud.com/skyux-popovers/docs/dropdown).
645
+ */
646
+ /* istanbul ignore next */
647
+ /* Code coverage having problems with no statements in classes */
648
+ class SkyRepeaterItemContextMenuComponent {
649
+ }
650
+ SkyRepeaterItemContextMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterItemContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
651
+ SkyRepeaterItemContextMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyRepeaterItemContextMenuComponent, selector: "sky-repeater-item-context-menu", ngImport: i0, template: "<ng-content></ng-content>\n" });
652
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterItemContextMenuComponent, decorators: [{
653
+ type: Component,
654
+ args: [{ selector: 'sky-repeater-item-context-menu', template: "<ng-content></ng-content>\n" }]
655
+ }] });
656
+
657
+ /**
658
+ * Displays a header inside the repeater item.
659
+ */
660
+ class SkyRepeaterItemTitleComponent {
661
+ }
662
+ SkyRepeaterItemTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterItemTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
663
+ SkyRepeaterItemTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyRepeaterItemTitleComponent, selector: "sky-repeater-item-title", ngImport: i0, template: "<ng-content></ng-content>\n" });
664
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterItemTitleComponent, decorators: [{
665
+ type: Component,
666
+ args: [{ selector: 'sky-repeater-item-title', template: "<ng-content></ng-content>\n" }]
667
+ }] });
668
+
669
+ /**
670
+ * @internal
671
+ */
672
+ class SkyRepeaterService {
673
+ constructor() {
674
+ this.activeItemChange = new BehaviorSubject(undefined);
675
+ this.activeItemIndexChange = new BehaviorSubject(undefined);
676
+ this.enableActiveState = false;
677
+ this.itemCollapseStateChange = new EventEmitter();
678
+ this.items = [];
679
+ this.orderChange = new BehaviorSubject(undefined);
680
+ }
681
+ ngOnDestroy() {
682
+ this.activeItemChange.complete();
683
+ this.itemCollapseStateChange.complete();
684
+ this.orderChange.complete();
685
+ }
686
+ activateItem(item) {
687
+ if (this.enableActiveState) {
688
+ /* istanbul ignore else */
689
+ if (item) {
690
+ const index = this.items.findIndex((i) => i === item);
691
+ this.activeItemIndexChange.next(index);
692
+ this.activeItemChange.next(item);
693
+ }
694
+ }
695
+ }
696
+ activateItemByIndex(index) {
697
+ /* istanbul ignore else */
698
+ if (this.enableActiveState) {
699
+ if (index === undefined) {
700
+ this.activeItemChange.next(undefined);
701
+ }
702
+ else {
703
+ const activeItem = this.items[index];
704
+ if (activeItem) {
705
+ this.activeItemChange.next(activeItem);
706
+ }
707
+ }
708
+ }
709
+ }
710
+ registerItem(item) {
711
+ this.items.push(item);
712
+ }
713
+ unregisterItem(item) {
714
+ const indexOfDestroyedItem = this.items.indexOf(item);
715
+ if (indexOfDestroyedItem > -1) {
716
+ this.items.splice(indexOfDestroyedItem, 1);
717
+ }
718
+ }
719
+ onItemCollapseStateChange(item) {
720
+ this.itemCollapseStateChange.emit(item);
721
+ }
722
+ getItemIndex(item) {
723
+ return this.items.indexOf(item);
724
+ }
725
+ registerOrderChange() {
726
+ this.orderChange.next();
727
+ }
728
+ reorderItem(oldIndex, newIndex) {
729
+ this.items.splice(newIndex, 0, this.items.splice(oldIndex, 1)[0]);
730
+ }
731
+ }
732
+ SkyRepeaterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
733
+ SkyRepeaterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterService });
734
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterService, decorators: [{
735
+ type: Injectable
736
+ }] });
737
+
738
+ /**
739
+ * @internal
740
+ */
741
+ class SkyRepeaterAdapterService {
742
+ constructor(repeaterService) {
743
+ this.repeaterService = repeaterService;
744
+ }
745
+ get repeaterItemGroupSelector() {
746
+ return '.sky-repeater-item-group-' + this.repeaterService.repeaterGroupId;
747
+ }
748
+ focusElement(element) {
749
+ if (element instanceof ElementRef) {
750
+ element.nativeElement.focus();
751
+ }
752
+ else {
753
+ element.focus();
754
+ }
755
+ }
756
+ setRepeaterHost(hostRef) {
757
+ this.host = hostRef;
758
+ }
759
+ getRepeaterItemIndex(element) {
760
+ return this.getRepeaterItemArray().indexOf(element);
761
+ }
762
+ moveItemUp(element, top = false, steps = 1) {
763
+ const index = this.getRepeaterItemIndex(element);
764
+ if (index === 0) {
765
+ return;
766
+ }
767
+ let newIndex = index - steps;
768
+ if (top || newIndex < 0) {
769
+ newIndex = 0;
770
+ }
771
+ return this.moveItem(element, index, newIndex);
772
+ }
773
+ moveItemDown(element, steps = 1) {
774
+ const itemArray = this.getRepeaterItemArray();
775
+ const index = this.getRepeaterItemIndex(element);
776
+ if (index === itemArray.length - steps) {
777
+ return;
778
+ }
779
+ const newIndex = index + steps;
780
+ return this.moveItem(element, index, newIndex);
781
+ }
782
+ moveItem(element, oldIndex, newIndex) {
783
+ const repeaterDiv = this.host.nativeElement.querySelector('.sky-repeater');
784
+ repeaterDiv.removeChild(element);
785
+ const nextSibling = repeaterDiv.querySelectorAll(this.repeaterItemGroupSelector)[newIndex];
786
+ repeaterDiv.insertBefore(element, nextSibling);
787
+ this.repeaterService.reorderItem(oldIndex, newIndex);
788
+ return newIndex;
789
+ }
790
+ /**
791
+ * Returns an array of the immediate repeater item descendants. Excludes nested repeater items.
792
+ */
793
+ getRepeaterItemArray() {
794
+ return Array.from(this.host.nativeElement.querySelectorAll(this.repeaterItemGroupSelector));
795
+ }
796
+ }
797
+ SkyRepeaterAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterAdapterService, deps: [{ token: SkyRepeaterService }], target: i0.ɵɵFactoryTarget.Injectable });
798
+ SkyRepeaterAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterAdapterService });
799
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterAdapterService, decorators: [{
800
+ type: Injectable
801
+ }], ctorParameters: function () { return [{ type: SkyRepeaterService }]; } });
802
+
803
+ let nextContentId = 0;
804
+ /**
805
+ * Creates an individual repeater item.
806
+ */
807
+ class SkyRepeaterItemComponent {
808
+ constructor(repeaterService, changeDetector, adapterService, elementRef, resourceService) {
809
+ this.repeaterService = repeaterService;
810
+ this.changeDetector = changeDetector;
811
+ this.adapterService = adapterService;
812
+ this.elementRef = elementRef;
813
+ this.resourceService = resourceService;
814
+ /**
815
+ * Indicates whether users can change the order of the repeater item.
816
+ * The repeater component's `reorderable` property must also be set to `true`.
817
+ */
818
+ this.reorderable = false;
819
+ /**
820
+ * Indicates whether to display a checkbox in the left of the repeater item.
821
+ */
822
+ this.selectable = false;
823
+ /**
824
+ * Indicates whether to display an inline form within the repeater.
825
+ * Users can toggle between displaying and hiding the inline form.
826
+ */
827
+ this.showInlineForm = false;
828
+ /**
829
+ * Fires when users collapse the repeater item.
830
+ */
831
+ this.collapse = new EventEmitter();
832
+ /**
833
+ * Fires when users expand the repeater item.
834
+ */
835
+ this.expand = new EventEmitter();
836
+ /**
837
+ * Fires when the repeater includes an inline form and users close it. This event emits
838
+ * [a `SkyInlineFormCloseArgs` type](https://developer.blackbaud.com/skyux/components/inline-form#skyinlineformcloseargs-properties).
839
+ */
840
+ this.inlineFormClose = new EventEmitter();
841
+ /**
842
+ * Fires when users select or clear the checkbox for the repeater item.
843
+ */
844
+ this.isSelectedChange = new EventEmitter();
845
+ this.contentId = `sky-repeater-item-content-${++nextContentId}`;
846
+ this.hasItemContent = false;
847
+ this.isActive = false;
848
+ this.keyboardReorderingEnabled = false;
849
+ this.ngUnsubscribe = new Subject();
850
+ this._isCollapsible = true;
851
+ this._isExpanded = true;
852
+ this._isSelected = false;
853
+ this.slideForExpanded(false);
854
+ forkJoin([
855
+ this.resourceService.getString('skyux_repeater_item_reorder_cancel'),
856
+ this.resourceService.getString('skyux_repeater_item_reorder_finish'),
857
+ this.resourceService.getString('skyux_repeater_item_reorder_instructions'),
858
+ this.resourceService.getString('skyux_repeater_item_reorder_operation'),
859
+ this.resourceService.getString('skyux_repeater_item_reorder_moved'),
860
+ ]).subscribe((translatedStrings) => {
861
+ this.reorderCancelText = translatedStrings[0];
862
+ this.reorderFinishText = translatedStrings[1];
863
+ this.reorderStateDescription = translatedStrings[2];
864
+ this.reorderInstructions = translatedStrings[3];
865
+ this.reorderMovedText = translatedStrings[4];
866
+ this.reorderButtonLabel = this.reorderInstructions;
867
+ });
868
+ }
869
+ /**
870
+ * Indicates whether the repeater item is expanded.
871
+ * @default true
872
+ */
873
+ set isExpanded(value) {
874
+ this.updateForExpanded(value, true);
875
+ }
876
+ get isExpanded() {
877
+ return this._isExpanded;
878
+ }
879
+ /**
880
+ * Indicates whether the repeater item's checkbox is selected.
881
+ * When users select the repeater item, the specified property on your model is updated accordingly.
882
+ * @default false
883
+ */
884
+ set isSelected(value) {
885
+ if (value !== this._isSelected) {
886
+ this._isSelected = value;
887
+ this.isSelectedChange.emit(this._isSelected);
888
+ }
889
+ }
890
+ get isSelected() {
891
+ return this._isSelected;
892
+ }
893
+ set isCollapsible(value) {
894
+ if (this.isCollapsible !== value) {
895
+ this._isCollapsible = value;
896
+ /*istanbul ignore else */
897
+ if (!value) {
898
+ this.updateForExpanded(true, false);
899
+ }
900
+ }
901
+ this.changeDetector.markForCheck();
902
+ }
903
+ get isCollapsible() {
904
+ return this._isCollapsible;
905
+ }
906
+ get repeaterGroupClass() {
907
+ return 'sky-repeater-item-group-' + this.repeaterService.repeaterGroupId;
908
+ }
909
+ ngOnInit() {
910
+ this.repeaterService.registerItem(this);
911
+ this.repeaterService.activeItemChange
912
+ .pipe(takeUntil(this.ngUnsubscribe))
913
+ .subscribe((item) => {
914
+ const newIsActiveValue = this === item;
915
+ if (newIsActiveValue !== this.isActive) {
916
+ this.isActive = newIsActiveValue;
917
+ this.changeDetector.markForCheck();
918
+ }
919
+ });
920
+ }
921
+ ngAfterViewInit() {
922
+ this.hasItemContent = this.repeaterItemContentComponents.length > 0;
923
+ this.updateExpandOnContentChange();
924
+ }
925
+ ngOnDestroy() {
926
+ this.collapse.complete();
927
+ this.expand.complete();
928
+ this.inlineFormClose.complete();
929
+ this.isSelectedChange.complete();
930
+ this.ngUnsubscribe.next();
931
+ this.ngUnsubscribe.complete();
932
+ this.repeaterService.unregisterItem(this);
933
+ }
934
+ headerClick() {
935
+ if (this.isCollapsible) {
936
+ this.updateForExpanded(!this.isExpanded, true);
937
+ }
938
+ }
939
+ chevronDirectionChange(direction) {
940
+ this.updateForExpanded(direction === 'up', true);
941
+ }
942
+ onRepeaterItemClick(event) {
943
+ // Only activate item if clicking on the title, content, or parent item div.
944
+ // This will avoid accidental activations when clicking inside interactive elements like
945
+ // the expand/collapse chevron, dropdown, inline-delete, etc...
946
+ if (event.target === this.itemRef.nativeElement ||
947
+ this.itemContentRef.nativeElement.contains(event.target) ||
948
+ this.itemHeaderRef.nativeElement.contains(event.target)) {
949
+ this.repeaterService.activateItem(this);
950
+ }
951
+ }
952
+ updateForExpanded(value, animate) {
953
+ if (this.isCollapsible === false && value === false) {
954
+ console.warn(`Setting isExpanded to false when the repeater item is not collapsible
955
+ will have no effect.`);
956
+ }
957
+ else if (this._isExpanded !== value) {
958
+ this._isExpanded = value;
959
+ if (this._isExpanded) {
960
+ this.expand.emit();
961
+ }
962
+ else {
963
+ this.collapse.emit();
964
+ }
965
+ this.repeaterService.onItemCollapseStateChange(this);
966
+ this.slideForExpanded(animate);
967
+ this.changeDetector.markForCheck();
968
+ }
969
+ }
970
+ onCheckboxChange(value) {
971
+ this.isSelected = value.checked;
972
+ }
973
+ onInlineFormClose(inlineFormCloseArgs) {
974
+ this.inlineFormClose.emit(inlineFormCloseArgs);
975
+ }
976
+ moveToTop(event) {
977
+ event.stopPropagation();
978
+ this.adapterService.moveItemUp(this.elementRef.nativeElement, true);
979
+ this.adapterService.focusElement(event.target);
980
+ this.repeaterService.registerOrderChange();
981
+ }
982
+ onReorderHandleKeyDown(event) {
983
+ /*istanbul ignore else */
984
+ if (event.key) {
985
+ switch (event.key.toLowerCase()) {
986
+ case ' ':
987
+ case 'enter':
988
+ this.keyboardToggleReorder();
989
+ event.preventDefault();
990
+ event.stopPropagation();
991
+ break;
992
+ case 'escape':
993
+ /* istanbul ignore else */
994
+ if (this.keyboardReorderingEnabled) {
995
+ this.keyboardReorderingEnabled = false;
996
+ this.revertReorderSteps();
997
+ this.reorderButtonLabel =
998
+ this.reorderCancelText + ' ' + this.reorderInstructions;
999
+ this.adapterService.focusElement(event.target);
1000
+ event.preventDefault();
1001
+ event.stopPropagation();
1002
+ }
1003
+ break;
1004
+ case 'arrowup':
1005
+ if (this.keyboardReorderingEnabled) {
1006
+ this.keyboardReorderUp();
1007
+ event.preventDefault();
1008
+ event.stopPropagation();
1009
+ this.repeaterService.registerOrderChange();
1010
+ }
1011
+ break;
1012
+ case 'arrowdown':
1013
+ /* istanbul ignore else */
1014
+ if (this.keyboardReorderingEnabled) {
1015
+ this.keyboardReorderDown();
1016
+ event.preventDefault();
1017
+ event.stopPropagation();
1018
+ this.repeaterService.registerOrderChange();
1019
+ }
1020
+ break;
1021
+ case 'arrowleft':
1022
+ case 'arrowright':
1023
+ /* istanbul ignore else */
1024
+ if (this.keyboardReorderingEnabled) {
1025
+ event.preventDefault();
1026
+ event.stopPropagation();
1027
+ }
1028
+ break;
1029
+ /* istanbul ignore next */
1030
+ default:
1031
+ break;
1032
+ }
1033
+ }
1034
+ }
1035
+ onReorderHandleBlur(event) {
1036
+ this.keyboardReorderingEnabled = false;
1037
+ this.revertReorderSteps();
1038
+ this.reorderButtonLabel = this.reorderInstructions;
1039
+ this.reorderState = undefined;
1040
+ }
1041
+ onItemKeyDown(event) {
1042
+ /*istanbul ignore else */
1043
+ if (event.key) {
1044
+ switch (event.key.toLowerCase()) {
1045
+ case ' ':
1046
+ case 'enter':
1047
+ /* istanbul ignore else */
1048
+ /* Sanity check */
1049
+ // Space/enter should never execute unless focused on the parent item element.
1050
+ if (event.target === this.itemRef.nativeElement) {
1051
+ if (this.selectable) {
1052
+ this.isSelected = !this.isSelected;
1053
+ }
1054
+ this.repeaterService.activateItem(this);
1055
+ event.preventDefault();
1056
+ }
1057
+ break;
1058
+ /* istanbul ignore next */
1059
+ default:
1060
+ break;
1061
+ }
1062
+ }
1063
+ }
1064
+ slideForExpanded(animate) {
1065
+ this.slideDirection = this.isExpanded ? 'down' : 'up';
1066
+ }
1067
+ keyboardReorderUp() {
1068
+ this.reorderCurrentIndex = this.adapterService.moveItemUp(this.elementRef.nativeElement);
1069
+ this.reorderSteps--;
1070
+ this.adapterService.focusElement(this.grabHandle);
1071
+ this.keyboardReorderingEnabled = true;
1072
+ this.reorderButtonLabel = `${this.reorderMovedText} ${this.reorderCurrentIndex + 1}`;
1073
+ }
1074
+ keyboardReorderDown() {
1075
+ this.reorderCurrentIndex = this.adapterService.moveItemDown(this.elementRef.nativeElement);
1076
+ this.reorderSteps++;
1077
+ this.adapterService.focusElement(this.grabHandle);
1078
+ this.keyboardReorderingEnabled = true;
1079
+ this.reorderButtonLabel = `${this.reorderMovedText} ${this.reorderCurrentIndex + 1}`;
1080
+ }
1081
+ keyboardToggleReorder() {
1082
+ this.keyboardReorderingEnabled = !this.keyboardReorderingEnabled;
1083
+ this.reorderSteps = 0;
1084
+ if (this.keyboardReorderingEnabled) {
1085
+ this.reorderState = this.reorderStateDescription;
1086
+ }
1087
+ else {
1088
+ this.reorderState = `${this.reorderFinishText} ${this.reorderCurrentIndex + 1} ${this.reorderInstructions}`;
1089
+ }
1090
+ }
1091
+ revertReorderSteps() {
1092
+ if (this.reorderSteps < 0) {
1093
+ this.adapterService.moveItemDown(this.elementRef.nativeElement, Math.abs(this.reorderSteps));
1094
+ }
1095
+ else if (this.reorderSteps > 0) {
1096
+ this.adapterService.moveItemUp(this.elementRef.nativeElement, false, this.reorderSteps);
1097
+ }
1098
+ this.repeaterService.registerOrderChange();
1099
+ }
1100
+ updateExpandOnContentChange() {
1101
+ this.repeaterItemContentComponents.changes
1102
+ .pipe(takeUntil(this.ngUnsubscribe))
1103
+ .subscribe(() => {
1104
+ this.hasItemContent = this.repeaterItemContentComponents.length > 0;
1105
+ /* istanbul ignore next */
1106
+ this.isCollapsible =
1107
+ this.hasItemContent && this.repeaterService.expandMode !== 'none';
1108
+ /* istanbul ignore else */
1109
+ if (this.repeaterService.expandMode === 'single') {
1110
+ this.repeaterService.onItemCollapseStateChange(this);
1111
+ }
1112
+ });
1113
+ }
1114
+ }
1115
+ SkyRepeaterItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterItemComponent, deps: [{ token: SkyRepeaterService }, { token: i0.ChangeDetectorRef }, { token: SkyRepeaterAdapterService }, { token: i0.ElementRef }, { token: i4.SkyLibResourcesService }], target: i0.ɵɵFactoryTarget.Component });
1116
+ SkyRepeaterItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyRepeaterItemComponent, selector: "sky-repeater-item", inputs: { itemName: "itemName", inlineFormConfig: "inlineFormConfig", inlineFormTemplate: "inlineFormTemplate", isExpanded: "isExpanded", isSelected: "isSelected", reorderable: "reorderable", selectable: "selectable", showInlineForm: "showInlineForm", tag: "tag" }, outputs: { collapse: "collapse", expand: "expand", inlineFormClose: "inlineFormClose", isSelectedChange: "isSelectedChange" }, host: { properties: { "class": "this.repeaterGroupClass" } }, queries: [{ propertyName: "contextMenu", first: true, predicate: SkyRepeaterItemContextMenuComponent, descendants: true, read: ElementRef }, { propertyName: "repeaterItemContentComponents", predicate: SkyRepeaterItemContentComponent }], viewQueries: [{ propertyName: "grabHandle", first: true, predicate: ["grabHandle"], descendants: true, read: ElementRef }, { propertyName: "itemContentRef", first: true, predicate: ["itemContentRef"], descendants: true, read: ElementRef }, { propertyName: "itemHeaderRef", first: true, predicate: ["itemHeaderRef"], descendants: true, read: ElementRef }, { propertyName: "itemRef", first: true, predicate: ["itemRef"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n class=\"sky-repeater-item sky-padding-even-default\"\n role=\"option\"\n [attr.aria-label]=\"itemName\"\n [attr.aria-selected]=\"selectable ? isSelected : null\"\n [ngClass]=\"{\n 'sky-repeater-item-active': isActive,\n 'sky-repeater-item-collapsible': isCollapsible,\n 'sky-repeater-item-selected': isSelected\n }\"\n (click)=\"onRepeaterItemClick($event)\"\n (keydown)=\"onItemKeyDown($event)\"\n #itemRef\n>\n <div #inlineDelete>\n <ng-content select=\"sky-inline-delete\"></ng-content>\n </div>\n\n <ng-container *ngIf=\"inlineFormTemplate\">\n <sky-inline-form\n [config]=\"inlineFormConfig\"\n [showForm]=\"showInlineForm\"\n [template]=\"inlineFormTemplate\"\n (close)=\"onInlineFormClose($event)\"\n >\n <ng-container *ngTemplateOutlet=\"skyRepeaterItemLeft\"></ng-container>\n <ng-container *ngTemplateOutlet=\"skyRepeaterItemRight\"></ng-container>\n </sky-inline-form>\n </ng-container>\n\n <ng-container *ngIf=\"!inlineFormTemplate\">\n <ng-container *ngTemplateOutlet=\"skyRepeaterItemLeft\"></ng-container>\n <ng-container *ngTemplateOutlet=\"skyRepeaterItemRight\"></ng-container>\n </ng-container>\n</div>\n\n<ng-template #skyRepeaterItemLeft>\n <div class=\"sky-repeater-item-left\">\n <ng-container *ngIf=\"reorderable\">\n <span\n aria-live=\"assertive\"\n class=\"sky-screen-reader-only\"\n [id]=\"contentId + '-reorder-state'\"\n >\n {{ reorderState }}\n </span>\n <span\n class=\"sky-screen-reader-only\"\n [id]=\"contentId + '-reorder-instructions'\"\n >{{ reorderButtonLabel }}</span\n >\n <button\n class=\"sky-btn sky-tile-tools-control sky-repeater-item-grab-handle\"\n type=\"button\"\n [attr.aria-describedby]=\"contentId + '-reorder-instructions'\"\n [attr.aria-label]=\"\n itemName\n ? ('skyux_repeater_item_reorder_label' | skyLibResources: itemName)\n : ('skyux_repeater_item_reorder_label_default' | skyLibResources)\n \"\n (blur)=\"onReorderHandleBlur($event)\"\n (keydown)=\"onReorderHandleKeyDown($event)\"\n #grabHandle\n >\n <sky-icon icon=\"arrows-v\"></sky-icon>\n </button>\n </ng-container>\n <sky-checkbox\n *ngIf=\"selectable\"\n class=\"sky-repeater-item-checkbox\"\n [checked]=\"isSelected\"\n [label]=\"\n itemName\n ? ('skyux_repeater_item_checkbox_label' | skyLibResources: itemName)\n : ('skyux_repeater_item_checkbox_label_default' | skyLibResources)\n \"\n (change)=\"onCheckboxChange($event)\"\n >\n </sky-checkbox>\n <div\n class=\"sky-repeater-item-context-menu\"\n [hidden]=\"contextMenuEl.children.length === 0\"\n #contextMenuEl\n >\n <ng-content select=\"sky-repeater-item-context-menu\"></ng-content>\n </div>\n </div>\n</ng-template>\n\n<ng-template #skyRepeaterItemRight>\n <div class=\"sky-repeater-item-right\" #itemHeaderRef>\n <div\n class=\"sky-repeater-item-header\"\n [hidden]=\"titleRef.children.length === 0\"\n (click)=\"headerClick()\"\n >\n <div class=\"sky-repeater-item-title sky-emphasized\" #titleRef>\n <ng-content select=\"sky-repeater-item-title\"></ng-content>\n </div>\n <button\n *ngIf=\"reorderable\"\n class=\"sky-btn sky-btn-link sky-repeater-item-reorder-top\"\n type=\"button\"\n [attr.aria-label]=\"\n itemName\n ? ('skyux_repeater_item_reorder_top_label'\n | skyLibResources: itemName)\n : ('skyux_repeater_item_reorder_top_label_default'\n | skyLibResources)\n \"\n (click)=\"moveToTop($event)\"\n >\n <sky-icon icon=\"arrow-circle-up\"></sky-icon>\n {{ 'skyux_repeater_item_reorder_top' | skyLibResources }}\n </button>\n <div *ngIf=\"isCollapsible\" class=\"sky-repeater-item-chevron\">\n <sky-chevron\n [ariaControls]=\"contentId\"\n [ariaLabel]=\"\n itemName\n ? ('skyux_repeater_item_expand' | skyLibResources: itemName)\n : ('skyux_repeater_item_expand_default' | skyLibResources)\n \"\n [direction]=\"isExpanded ? 'up' : 'down'\"\n (directionChange)=\"chevronDirectionChange($event)\"\n >\n </sky-chevron>\n </div>\n <!-- Used for when the chevron is hidden to ensure that the right side is the same height as the left.-->\n <div\n *ngIf=\"!isCollapsible && !contextMenu\"\n class=\"sky-repeater-item-chevron-placeholder\"\n ></div>\n <!-- Used to ensure that the right side is the same height as the left.-->\n <div\n *ngIf=\"contextMenu\"\n class=\"sky-repeater-item-chevron-placeholder-with-context\"\n ></div>\n </div>\n <div\n class=\"sky-repeater-item-content\"\n [id]=\"contentId\"\n [@skyAnimationSlide]=\"slideDirection\"\n #itemContentRef\n >\n <ng-content select=\"sky-repeater-item-content\"></ng-content>\n </div>\n </div>\n</ng-template>\n", styles: ["sky-repeater-item .sky-repeater-item{display:flex;border-bottom:1px dotted #cdcfd2;padding-top:0;position:relative;transition:box-shadow .15s;align-items:flex-start}sky-repeater-item .sky-repeater-item sky-inline-form{display:block;width:100%}sky-repeater-item .sky-repeater-item sky-inline-form>:first-child,sky-repeater-item .sky-repeater-item sky-inline-form .sky-slide-dissolve-first,sky-repeater-item .sky-repeater-item sky-inline-form .sky-slide-dissolve-last{display:flex;flex:1 0 auto;width:100%}sky-repeater-item .sky-repeater-item sky-inline-form .sky-slide-dissolve-last{padding-top:10px}sky-repeater-item .sky-repeater-item.sky-repeater-item-active{background-color:#eeeeef;color:#212327;padding-left:6px;border-left:4px solid #00b4f1}sky-repeater-item .sky-repeater-item.sky-repeater-item-active .sky-inline-delete{margin-left:-4px;width:calc(100% + 4px)}sky-repeater-item .sky-repeater-item-left{display:flex;padding-top:10px;align-items:center}sky-repeater-item .sky-repeater-item-left sky-checkbox{display:flex}sky-repeater-item .sky-repeater-item-right{max-width:100%;flex-grow:1;align-self:center}sky-repeater-item .sky-repeater-item-header{align-items:center;display:flex;padding-top:10px}sky-repeater-item .sky-repeater-item-chevron{margin-left:10px}sky-repeater-item .sky-repeater-item-chevron-placeholder{height:24px}sky-repeater-item .sky-repeater-item-chevron-placeholder-with-context{height:29px}sky-repeater-item .sky-repeater-item-context-menu{padding:0 10px 0 0}sky-repeater-item .sky-repeater-item-checkbox{padding:0 5px 0 0}sky-repeater-item .sky-repeater-item-selected{background-color:#f1eef6;transition:background-color .15s}sky-repeater-item .sky-repeater-item-title{margin:0;flex-grow:1;line-height:1.1;color:#212327}sky-repeater-item sky-repeater-item-content{display:block;margin:10px 0 0}sky-repeater-item .sky-repeater-item-collapsible .sky-repeater-item-header{cursor:pointer}sky-repeater-item .sky-repeater-item-collapsible .sky-repeater-item-content{padding-right:34px}sky-repeater-item .sky-repeater-item-collapsed .sky-repeater-item-content{display:none}sky-repeater-item .sky-repeater-item-grab-handle{color:#cdcfd2;cursor:pointer;border:0;width:24px;height:24px;cursor:grab;cursor:-moz-grab;padding:0;margin-right:10px}sky-repeater-item .sky-repeater-item-grab-handle:hover{color:#979ba2;transition:color .15s}sky-repeater-item.sky-repeater-item-dragging.gu-mirror{opacity:initial;-ms-filter:initial;filter:initial;background-color:#fff;box-shadow:0 0 5px #0000004d}sky-repeater-item.sky-repeater-item-dragging.gu-transit .sky-repeater-item{background-color:#d8d8d8}sky-repeater-item.sky-repeater-item-dragging.gu-transit .sky-repeater-item .sky-repeater-item-left,sky-repeater-item.sky-repeater-item-dragging.gu-transit .sky-repeater-item .sky-repeater-item-right{visibility:hidden}sky-repeater-item.sky-repeater-item-dragging .sky-repeater-item-grab-handle{cursor:grabbing;cursor:-webkit-grabbing}.sky-theme-modern sky-repeater-item .sky-repeater-item{padding-bottom:20px}.sky-theme-modern sky-repeater-item .sky-repeater-item.sky-repeater-item-active{background-color:transparent;border-left-color:#1870b8}.sky-theme-modern sky-repeater-item .sky-repeater-item:focus,.sky-theme-modern sky-repeater-item .sky-repeater-item:active:focus{outline:solid 2px #1870B8;outline-offset:-2px}.sky-theme-modern sky-repeater-item .sky-repeater-item:focus:not(:active){box-shadow:0 1px 8px #0000004d}.sky-theme-modern sky-repeater-item .sky-repeater-item-header[hidden]+.sky-repeater-item-content sky-repeater-item-content{margin:20px 0 0}.sky-theme-modern sky-repeater-item .sky-repeater-item-header,.sky-theme-modern sky-repeater-item .sky-repeater-item-left{padding-top:20px}.sky-theme-modern sky-repeater-item sky-inline-form .sky-slide-dissolve-last{padding-top:20px}.sky-theme-modern.sky-theme-mode-dark sky-repeater-item .sky-repeater-item{border-bottom-color:#686c73}.sky-theme-modern.sky-theme-mode-dark sky-repeater-item .sky-repeater-item.sky-repeater-item-active{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark sky-repeater-item .sky-repeater-item-title{color:#fbfcfe}\n"], components: [{ type: i4$1.λ1, selector: "sky-inline-form", inputs: ["config", "template", "showForm"], outputs: ["close"] }, { type: i1.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { type: i6.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "icon", "checkboxType", "checked", "required"], outputs: ["change", "checkedChange", "disabledChange"] }, { type: i1.λ2, selector: "sky-chevron", inputs: ["ariaControls", "ariaLabel", "direction", "disabled"], outputs: ["directionChange"] }], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, animations: [skyAnimationSlide], encapsulation: i0.ViewEncapsulation.None });
1117
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterItemComponent, decorators: [{
1118
+ type: Component,
1119
+ args: [{ selector: 'sky-repeater-item', animations: [skyAnimationSlide], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"sky-repeater-item sky-padding-even-default\"\n role=\"option\"\n [attr.aria-label]=\"itemName\"\n [attr.aria-selected]=\"selectable ? isSelected : null\"\n [ngClass]=\"{\n 'sky-repeater-item-active': isActive,\n 'sky-repeater-item-collapsible': isCollapsible,\n 'sky-repeater-item-selected': isSelected\n }\"\n (click)=\"onRepeaterItemClick($event)\"\n (keydown)=\"onItemKeyDown($event)\"\n #itemRef\n>\n <div #inlineDelete>\n <ng-content select=\"sky-inline-delete\"></ng-content>\n </div>\n\n <ng-container *ngIf=\"inlineFormTemplate\">\n <sky-inline-form\n [config]=\"inlineFormConfig\"\n [showForm]=\"showInlineForm\"\n [template]=\"inlineFormTemplate\"\n (close)=\"onInlineFormClose($event)\"\n >\n <ng-container *ngTemplateOutlet=\"skyRepeaterItemLeft\"></ng-container>\n <ng-container *ngTemplateOutlet=\"skyRepeaterItemRight\"></ng-container>\n </sky-inline-form>\n </ng-container>\n\n <ng-container *ngIf=\"!inlineFormTemplate\">\n <ng-container *ngTemplateOutlet=\"skyRepeaterItemLeft\"></ng-container>\n <ng-container *ngTemplateOutlet=\"skyRepeaterItemRight\"></ng-container>\n </ng-container>\n</div>\n\n<ng-template #skyRepeaterItemLeft>\n <div class=\"sky-repeater-item-left\">\n <ng-container *ngIf=\"reorderable\">\n <span\n aria-live=\"assertive\"\n class=\"sky-screen-reader-only\"\n [id]=\"contentId + '-reorder-state'\"\n >\n {{ reorderState }}\n </span>\n <span\n class=\"sky-screen-reader-only\"\n [id]=\"contentId + '-reorder-instructions'\"\n >{{ reorderButtonLabel }}</span\n >\n <button\n class=\"sky-btn sky-tile-tools-control sky-repeater-item-grab-handle\"\n type=\"button\"\n [attr.aria-describedby]=\"contentId + '-reorder-instructions'\"\n [attr.aria-label]=\"\n itemName\n ? ('skyux_repeater_item_reorder_label' | skyLibResources: itemName)\n : ('skyux_repeater_item_reorder_label_default' | skyLibResources)\n \"\n (blur)=\"onReorderHandleBlur($event)\"\n (keydown)=\"onReorderHandleKeyDown($event)\"\n #grabHandle\n >\n <sky-icon icon=\"arrows-v\"></sky-icon>\n </button>\n </ng-container>\n <sky-checkbox\n *ngIf=\"selectable\"\n class=\"sky-repeater-item-checkbox\"\n [checked]=\"isSelected\"\n [label]=\"\n itemName\n ? ('skyux_repeater_item_checkbox_label' | skyLibResources: itemName)\n : ('skyux_repeater_item_checkbox_label_default' | skyLibResources)\n \"\n (change)=\"onCheckboxChange($event)\"\n >\n </sky-checkbox>\n <div\n class=\"sky-repeater-item-context-menu\"\n [hidden]=\"contextMenuEl.children.length === 0\"\n #contextMenuEl\n >\n <ng-content select=\"sky-repeater-item-context-menu\"></ng-content>\n </div>\n </div>\n</ng-template>\n\n<ng-template #skyRepeaterItemRight>\n <div class=\"sky-repeater-item-right\" #itemHeaderRef>\n <div\n class=\"sky-repeater-item-header\"\n [hidden]=\"titleRef.children.length === 0\"\n (click)=\"headerClick()\"\n >\n <div class=\"sky-repeater-item-title sky-emphasized\" #titleRef>\n <ng-content select=\"sky-repeater-item-title\"></ng-content>\n </div>\n <button\n *ngIf=\"reorderable\"\n class=\"sky-btn sky-btn-link sky-repeater-item-reorder-top\"\n type=\"button\"\n [attr.aria-label]=\"\n itemName\n ? ('skyux_repeater_item_reorder_top_label'\n | skyLibResources: itemName)\n : ('skyux_repeater_item_reorder_top_label_default'\n | skyLibResources)\n \"\n (click)=\"moveToTop($event)\"\n >\n <sky-icon icon=\"arrow-circle-up\"></sky-icon>\n {{ 'skyux_repeater_item_reorder_top' | skyLibResources }}\n </button>\n <div *ngIf=\"isCollapsible\" class=\"sky-repeater-item-chevron\">\n <sky-chevron\n [ariaControls]=\"contentId\"\n [ariaLabel]=\"\n itemName\n ? ('skyux_repeater_item_expand' | skyLibResources: itemName)\n : ('skyux_repeater_item_expand_default' | skyLibResources)\n \"\n [direction]=\"isExpanded ? 'up' : 'down'\"\n (directionChange)=\"chevronDirectionChange($event)\"\n >\n </sky-chevron>\n </div>\n <!-- Used for when the chevron is hidden to ensure that the right side is the same height as the left.-->\n <div\n *ngIf=\"!isCollapsible && !contextMenu\"\n class=\"sky-repeater-item-chevron-placeholder\"\n ></div>\n <!-- Used to ensure that the right side is the same height as the left.-->\n <div\n *ngIf=\"contextMenu\"\n class=\"sky-repeater-item-chevron-placeholder-with-context\"\n ></div>\n </div>\n <div\n class=\"sky-repeater-item-content\"\n [id]=\"contentId\"\n [@skyAnimationSlide]=\"slideDirection\"\n #itemContentRef\n >\n <ng-content select=\"sky-repeater-item-content\"></ng-content>\n </div>\n </div>\n</ng-template>\n", styles: ["sky-repeater-item .sky-repeater-item{display:flex;border-bottom:1px dotted #cdcfd2;padding-top:0;position:relative;transition:box-shadow .15s;align-items:flex-start}sky-repeater-item .sky-repeater-item sky-inline-form{display:block;width:100%}sky-repeater-item .sky-repeater-item sky-inline-form>:first-child,sky-repeater-item .sky-repeater-item sky-inline-form .sky-slide-dissolve-first,sky-repeater-item .sky-repeater-item sky-inline-form .sky-slide-dissolve-last{display:flex;flex:1 0 auto;width:100%}sky-repeater-item .sky-repeater-item sky-inline-form .sky-slide-dissolve-last{padding-top:10px}sky-repeater-item .sky-repeater-item.sky-repeater-item-active{background-color:#eeeeef;color:#212327;padding-left:6px;border-left:4px solid #00b4f1}sky-repeater-item .sky-repeater-item.sky-repeater-item-active .sky-inline-delete{margin-left:-4px;width:calc(100% + 4px)}sky-repeater-item .sky-repeater-item-left{display:flex;padding-top:10px;align-items:center}sky-repeater-item .sky-repeater-item-left sky-checkbox{display:flex}sky-repeater-item .sky-repeater-item-right{max-width:100%;flex-grow:1;align-self:center}sky-repeater-item .sky-repeater-item-header{align-items:center;display:flex;padding-top:10px}sky-repeater-item .sky-repeater-item-chevron{margin-left:10px}sky-repeater-item .sky-repeater-item-chevron-placeholder{height:24px}sky-repeater-item .sky-repeater-item-chevron-placeholder-with-context{height:29px}sky-repeater-item .sky-repeater-item-context-menu{padding:0 10px 0 0}sky-repeater-item .sky-repeater-item-checkbox{padding:0 5px 0 0}sky-repeater-item .sky-repeater-item-selected{background-color:#f1eef6;transition:background-color .15s}sky-repeater-item .sky-repeater-item-title{margin:0;flex-grow:1;line-height:1.1;color:#212327}sky-repeater-item sky-repeater-item-content{display:block;margin:10px 0 0}sky-repeater-item .sky-repeater-item-collapsible .sky-repeater-item-header{cursor:pointer}sky-repeater-item .sky-repeater-item-collapsible .sky-repeater-item-content{padding-right:34px}sky-repeater-item .sky-repeater-item-collapsed .sky-repeater-item-content{display:none}sky-repeater-item .sky-repeater-item-grab-handle{color:#cdcfd2;cursor:pointer;border:0;width:24px;height:24px;cursor:grab;cursor:-moz-grab;padding:0;margin-right:10px}sky-repeater-item .sky-repeater-item-grab-handle:hover{color:#979ba2;transition:color .15s}sky-repeater-item.sky-repeater-item-dragging.gu-mirror{opacity:initial;-ms-filter:initial;filter:initial;background-color:#fff;box-shadow:0 0 5px #0000004d}sky-repeater-item.sky-repeater-item-dragging.gu-transit .sky-repeater-item{background-color:#d8d8d8}sky-repeater-item.sky-repeater-item-dragging.gu-transit .sky-repeater-item .sky-repeater-item-left,sky-repeater-item.sky-repeater-item-dragging.gu-transit .sky-repeater-item .sky-repeater-item-right{visibility:hidden}sky-repeater-item.sky-repeater-item-dragging .sky-repeater-item-grab-handle{cursor:grabbing;cursor:-webkit-grabbing}.sky-theme-modern sky-repeater-item .sky-repeater-item{padding-bottom:20px}.sky-theme-modern sky-repeater-item .sky-repeater-item.sky-repeater-item-active{background-color:transparent;border-left-color:#1870b8}.sky-theme-modern sky-repeater-item .sky-repeater-item:focus,.sky-theme-modern sky-repeater-item .sky-repeater-item:active:focus{outline:solid 2px #1870B8;outline-offset:-2px}.sky-theme-modern sky-repeater-item .sky-repeater-item:focus:not(:active){box-shadow:0 1px 8px #0000004d}.sky-theme-modern sky-repeater-item .sky-repeater-item-header[hidden]+.sky-repeater-item-content sky-repeater-item-content{margin:20px 0 0}.sky-theme-modern sky-repeater-item .sky-repeater-item-header,.sky-theme-modern sky-repeater-item .sky-repeater-item-left{padding-top:20px}.sky-theme-modern sky-repeater-item sky-inline-form .sky-slide-dissolve-last{padding-top:20px}.sky-theme-modern.sky-theme-mode-dark sky-repeater-item .sky-repeater-item{border-bottom-color:#686c73}.sky-theme-modern.sky-theme-mode-dark sky-repeater-item .sky-repeater-item.sky-repeater-item-active{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark sky-repeater-item .sky-repeater-item-title{color:#fbfcfe}\n"] }]
1120
+ }], ctorParameters: function () { return [{ type: SkyRepeaterService }, { type: i0.ChangeDetectorRef }, { type: SkyRepeaterAdapterService }, { type: i0.ElementRef }, { type: i4.SkyLibResourcesService }]; }, propDecorators: { itemName: [{
1121
+ type: Input
1122
+ }], inlineFormConfig: [{
1123
+ type: Input
1124
+ }], inlineFormTemplate: [{
1125
+ type: Input
1126
+ }], isExpanded: [{
1127
+ type: Input
1128
+ }], isSelected: [{
1129
+ type: Input
1130
+ }], reorderable: [{
1131
+ type: Input
1132
+ }], selectable: [{
1133
+ type: Input
1134
+ }], showInlineForm: [{
1135
+ type: Input
1136
+ }], tag: [{
1137
+ type: Input
1138
+ }], collapse: [{
1139
+ type: Output
1140
+ }], expand: [{
1141
+ type: Output
1142
+ }], inlineFormClose: [{
1143
+ type: Output
1144
+ }], isSelectedChange: [{
1145
+ type: Output
1146
+ }], contextMenu: [{
1147
+ type: ContentChild,
1148
+ args: [SkyRepeaterItemContextMenuComponent, { read: ElementRef }]
1149
+ }], repeaterGroupClass: [{
1150
+ type: HostBinding,
1151
+ args: ['class']
1152
+ }], grabHandle: [{
1153
+ type: ViewChild,
1154
+ args: ['grabHandle', { read: ElementRef }]
1155
+ }], itemContentRef: [{
1156
+ type: ViewChild,
1157
+ args: ['itemContentRef', { read: ElementRef }]
1158
+ }], itemHeaderRef: [{
1159
+ type: ViewChild,
1160
+ args: ['itemHeaderRef', { read: ElementRef }]
1161
+ }], itemRef: [{
1162
+ type: ViewChild,
1163
+ args: ['itemRef', { read: ElementRef }]
1164
+ }], repeaterItemContentComponents: [{
1165
+ type: ContentChildren,
1166
+ args: [SkyRepeaterItemContentComponent]
1167
+ }] } });
1168
+
1169
+ let uniqueId = 0;
1170
+ /**
1171
+ * Creates a container to display repeater items.
1172
+ */
1173
+ class SkyRepeaterComponent {
1174
+ constructor(changeDetector, repeaterService, adapterService, dragulaService, elementRef, renderer) {
1175
+ this.changeDetector = changeDetector;
1176
+ this.repeaterService = repeaterService;
1177
+ this.adapterService = adapterService;
1178
+ this.dragulaService = dragulaService;
1179
+ this.elementRef = elementRef;
1180
+ this.renderer = renderer;
1181
+ /**
1182
+ * Indicates whether users can change the order of items in the repeater list.
1183
+ * Each repeater item also has `reorderable` property to indicate whether
1184
+ * users can change its order.
1185
+ */
1186
+ this.reorderable = false;
1187
+ /**
1188
+ * Fires when the active repeater item changes.
1189
+ */
1190
+ this.activeIndexChange = new EventEmitter();
1191
+ /**
1192
+ * Fires when users change the order of repeater items.
1193
+ * This event emits an ordered array of the `tag` properties that the consumer provides for each repeater item.
1194
+ */
1195
+ this.orderChange = new EventEmitter();
1196
+ this.dragulaUnsubscribe = new Subject();
1197
+ this.ngUnsubscribe = new Subject();
1198
+ this._expandMode = 'none';
1199
+ this.dragulaGroupName = `sky-repeater-dragula-${++uniqueId}`;
1200
+ this.repeaterService.itemCollapseStateChange
1201
+ .pipe(takeUntil(this.ngUnsubscribe))
1202
+ .subscribe((item) => {
1203
+ if (this.expandMode === 'single' && item.isExpanded) {
1204
+ this.items.forEach((otherItem) => {
1205
+ if (otherItem !== item &&
1206
+ otherItem.isExpanded &&
1207
+ otherItem.isCollapsible) {
1208
+ otherItem.isExpanded = false;
1209
+ }
1210
+ });
1211
+ }
1212
+ });
1213
+ this.repeaterService.activeItemIndexChange
1214
+ .pipe(takeUntil(this.ngUnsubscribe))
1215
+ .subscribe((index) => {
1216
+ if (index !== this.activeIndex) {
1217
+ this.activeIndex = index;
1218
+ this.activeIndexChange.emit(index);
1219
+ }
1220
+ });
1221
+ this.repeaterService.orderChange
1222
+ .pipe(takeUntil(this.ngUnsubscribe))
1223
+ .subscribe(() => {
1224
+ this.emitTags();
1225
+ });
1226
+ this.repeaterService.repeaterGroupId = uniqueId;
1227
+ this.updateForExpandMode();
1228
+ this.adapterService.setRepeaterHost(this.elementRef);
1229
+ this.initializeDragAndDrop();
1230
+ }
1231
+ /**
1232
+ * Specifies a layout to determine which repeater items are expanded by default and whether
1233
+ * repeater items are expandable and collapsible. Collapsed items display titles only.
1234
+ * The valid options are `multiple`, `none`, and `single`.
1235
+ * - `multiple` loads repeater items in an expanded state unless `isExpanded` is set to
1236
+ * `false` for a repeater item. This layout allows users to expand and collapse
1237
+ * as many repeater items as necessary. It is best-suited to repeater items where body
1238
+ * content is important but users don't always need to see it.
1239
+ * - `none` loads all repeater items in an expanded state and does not allow users to
1240
+ * collapse them. This default layout provides the quickest access to the details in the
1241
+ * repeater items. It is best-suited to repeater items with concise content
1242
+ * that users need to view frequently.
1243
+ * - `single` loads one repeater item in an expanded state and collapses all others.
1244
+ * The expanded repeater item is the first one where `isExpanded` is set to `true`. This layout
1245
+ * allows users to expand one item at a time. It provides the most compact view and is
1246
+ * best-suited to repeater items where the most important information is in the titles
1247
+ * and users only occasionally need to view the body content.
1248
+ * @default "none"
1249
+ */
1250
+ set expandMode(value) {
1251
+ this.repeaterService.expandMode = value;
1252
+ this._expandMode = value;
1253
+ this.updateForExpandMode();
1254
+ }
1255
+ get expandMode() {
1256
+ return this._expandMode || 'none';
1257
+ }
1258
+ ngAfterContentInit() {
1259
+ // If activeIndex has been set on init, call service to activate the appropriate item.
1260
+ setTimeout(() => {
1261
+ if (this.activeIndex || this.activeIndex === 0) {
1262
+ this.repeaterService.activateItemByIndex(this.activeIndex);
1263
+ }
1264
+ if (this.reorderable && !this.everyItemHasTag()) {
1265
+ console.warn('Please supply tag properties for each repeater item when reordering functionality is enabled.');
1266
+ }
1267
+ });
1268
+ // HACK: Not updating for expand mode in a timeout causes an error.
1269
+ // https://github.com/angular/angular/issues/6005
1270
+ this.items.changes.pipe(takeUntil(this.ngUnsubscribe)).subscribe(() => {
1271
+ setTimeout(() => {
1272
+ if (this.items.last) {
1273
+ this.updateForExpandMode(this.items.last);
1274
+ this.items.last.reorderable = this.reorderable;
1275
+ }
1276
+ if (this.activeIndex !== undefined) {
1277
+ this.repeaterService.activateItemByIndex(this.activeIndex);
1278
+ }
1279
+ });
1280
+ });
1281
+ setTimeout(() => {
1282
+ this.updateForExpandMode();
1283
+ this.items.forEach((item) => {
1284
+ item.reorderable = this.reorderable;
1285
+ });
1286
+ }, 0);
1287
+ }
1288
+ ngOnChanges(changes) {
1289
+ if (changes['activeIndex']) {
1290
+ this.repeaterService.enableActiveState = true;
1291
+ if (changes['activeIndex'].currentValue !==
1292
+ changes['activeIndex'].previousValue) {
1293
+ this.repeaterService.activateItemByIndex(this.activeIndex);
1294
+ }
1295
+ }
1296
+ if (changes.reorderable) {
1297
+ if (this.items) {
1298
+ this.items.forEach((item) => (item.reorderable = this.reorderable));
1299
+ }
1300
+ this.changeDetector.markForCheck();
1301
+ }
1302
+ }
1303
+ ngOnDestroy() {
1304
+ this.ngUnsubscribe.next();
1305
+ this.ngUnsubscribe.complete();
1306
+ this.destroyDragAndDrop();
1307
+ }
1308
+ updateForExpandMode(itemAdded) {
1309
+ if (this.items) {
1310
+ let foundExpanded = false;
1311
+ const isCollapsible = this.expandMode !== 'none';
1312
+ const isSingle = this.expandMode === 'single';
1313
+ // Keep any newly-added expanded item expanded and collapse the rest.
1314
+ if (itemAdded && itemAdded.isExpanded) {
1315
+ foundExpanded = true;
1316
+ }
1317
+ this.items.forEach((item) => {
1318
+ item.isCollapsible = isCollapsible && !!item.hasItemContent;
1319
+ if (item !== itemAdded && isSingle && item.isExpanded) {
1320
+ if (foundExpanded) {
1321
+ item.updateForExpanded(false, false);
1322
+ }
1323
+ foundExpanded = true;
1324
+ }
1325
+ });
1326
+ }
1327
+ }
1328
+ initializeDragAndDrop() {
1329
+ /* Sanity check that we haven't already set up dragging abilities */
1330
+ /* istanbul ignore else */
1331
+ if (!this.dragulaService.find(this.dragulaGroupName)) {
1332
+ this.dragulaService.createGroup(this.dragulaGroupName, {
1333
+ moves: (el, container, handle) => {
1334
+ const target = el.querySelector('.sky-repeater-item-grab-handle');
1335
+ return this.reorderable && target && target.contains(handle);
1336
+ },
1337
+ });
1338
+ }
1339
+ let draggedItemIndex;
1340
+ this.dragulaService
1341
+ .drag(this.dragulaGroupName)
1342
+ .pipe(takeUntil(this.dragulaUnsubscribe))
1343
+ .subscribe((args) => {
1344
+ /* istanbul ignore else */
1345
+ if (args.name === this.dragulaGroupName) {
1346
+ this.renderer.addClass(args.el, 'sky-repeater-item-dragging');
1347
+ draggedItemIndex = this.adapterService.getRepeaterItemIndex(args.el);
1348
+ }
1349
+ });
1350
+ this.dragulaService
1351
+ .dragend(this.dragulaGroupName)
1352
+ .pipe(takeUntil(this.dragulaUnsubscribe))
1353
+ .subscribe((args) => {
1354
+ /* istanbul ignore else */
1355
+ if (args.name === this.dragulaGroupName) {
1356
+ this.renderer.removeClass(args.el, 'sky-repeater-item-dragging');
1357
+ const newItemIndex = this.adapterService.getRepeaterItemIndex(args.el);
1358
+ /* sanity check */
1359
+ /* istanbul ignore else */
1360
+ if (draggedItemIndex >= 0) {
1361
+ this.repeaterService.reorderItem(draggedItemIndex, newItemIndex);
1362
+ draggedItemIndex = undefined;
1363
+ }
1364
+ this.emitTags();
1365
+ }
1366
+ });
1367
+ }
1368
+ destroyDragAndDrop() {
1369
+ this.dragulaUnsubscribe.next();
1370
+ this.dragulaUnsubscribe.complete();
1371
+ this.dragulaUnsubscribe = undefined;
1372
+ /* Sanity check that we have set up dragging abilities */
1373
+ /* istanbul ignore else */
1374
+ if (this.dragulaService.find(this.dragulaGroupName)) {
1375
+ this.dragulaService.destroy(this.dragulaGroupName);
1376
+ }
1377
+ }
1378
+ emitTags() {
1379
+ const tags = this.repeaterService.items.map((item) => item.tag);
1380
+ this.orderChange.emit(tags);
1381
+ }
1382
+ everyItemHasTag() {
1383
+ /* sanity check */
1384
+ /* istanbul ignore if */
1385
+ if (!this.items || this.items.length === 0) {
1386
+ return false;
1387
+ }
1388
+ return this.items.toArray().every((item) => {
1389
+ return item.tag !== undefined;
1390
+ });
1391
+ }
1392
+ }
1393
+ SkyRepeaterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: SkyRepeaterService }, { token: SkyRepeaterAdapterService }, { token: i3$1.DragulaService }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
1394
+ SkyRepeaterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyRepeaterComponent, selector: "sky-repeater", inputs: { activeIndex: "activeIndex", ariaLabel: "ariaLabel", reorderable: "reorderable", expandMode: "expandMode" }, outputs: { activeIndexChange: "activeIndexChange", orderChange: "orderChange" }, providers: [SkyRepeaterService, SkyRepeaterAdapterService], queries: [{ propertyName: "items", predicate: SkyRepeaterItemComponent }], usesOnChanges: true, ngImport: i0, template: "<ng-container #repeaterHost>\n <div\n class=\"sky-repeater\"\n role=\"listbox\"\n [attr.aria-label]=\"ariaLabel || ('skyux_repeater_label' | skyLibResources)\"\n [dragula]=\"dragulaGroupName\"\n >\n <ng-content></ng-content>\n </div>\n</ng-container>\n", styles: [".sky-repeater{padding:0}\n"], directives: [{ type: i3$1.DragulaDirective, selector: "[dragula]", inputs: ["dragula", "dragulaModel"], outputs: ["dragulaModelChange"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
1395
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterComponent, decorators: [{
1396
+ type: Component,
1397
+ args: [{ selector: 'sky-repeater', providers: [SkyRepeaterService, SkyRepeaterAdapterService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container #repeaterHost>\n <div\n class=\"sky-repeater\"\n role=\"listbox\"\n [attr.aria-label]=\"ariaLabel || ('skyux_repeater_label' | skyLibResources)\"\n [dragula]=\"dragulaGroupName\"\n >\n <ng-content></ng-content>\n </div>\n</ng-container>\n", styles: [".sky-repeater{padding:0}\n"] }]
1398
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: SkyRepeaterService }, { type: SkyRepeaterAdapterService }, { type: i3$1.DragulaService }, { type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { activeIndex: [{
1399
+ type: Input
1400
+ }], ariaLabel: [{
1401
+ type: Input
1402
+ }], reorderable: [{
1403
+ type: Input
1404
+ }], expandMode: [{
1405
+ type: Input
1406
+ }], activeIndexChange: [{
1407
+ type: Output
1408
+ }], orderChange: [{
1409
+ type: Output
1410
+ }], items: [{
1411
+ type: ContentChildren,
1412
+ args: [SkyRepeaterItemComponent]
1413
+ }] } });
1414
+
1415
+ class SkyRepeaterModule {
1416
+ }
1417
+ SkyRepeaterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1418
+ SkyRepeaterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterModule, declarations: [SkyRepeaterComponent,
1419
+ SkyRepeaterItemComponent,
1420
+ SkyRepeaterItemContentComponent,
1421
+ SkyRepeaterItemContextMenuComponent,
1422
+ SkyRepeaterItemTitleComponent], imports: [CommonModule,
1423
+ DragulaModule,
1424
+ SkyChevronModule,
1425
+ SkyCheckboxModule,
1426
+ SkyIconModule,
1427
+ SkyInlineFormModule,
1428
+ SkyListsResourcesModule], exports: [SkyRepeaterComponent,
1429
+ SkyRepeaterItemComponent,
1430
+ SkyRepeaterItemContentComponent,
1431
+ SkyRepeaterItemContextMenuComponent,
1432
+ SkyRepeaterItemTitleComponent] });
1433
+ SkyRepeaterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterModule, providers: [DragulaService], imports: [[
1434
+ CommonModule,
1435
+ DragulaModule,
1436
+ SkyChevronModule,
1437
+ SkyCheckboxModule,
1438
+ SkyIconModule,
1439
+ SkyInlineFormModule,
1440
+ SkyListsResourcesModule,
1441
+ ]] });
1442
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyRepeaterModule, decorators: [{
1443
+ type: NgModule,
1444
+ args: [{
1445
+ declarations: [
1446
+ SkyRepeaterComponent,
1447
+ SkyRepeaterItemComponent,
1448
+ SkyRepeaterItemContentComponent,
1449
+ SkyRepeaterItemContextMenuComponent,
1450
+ SkyRepeaterItemTitleComponent,
1451
+ ],
1452
+ imports: [
1453
+ CommonModule,
1454
+ DragulaModule,
1455
+ SkyChevronModule,
1456
+ SkyCheckboxModule,
1457
+ SkyIconModule,
1458
+ SkyInlineFormModule,
1459
+ SkyListsResourcesModule,
1460
+ ],
1461
+ exports: [
1462
+ SkyRepeaterComponent,
1463
+ SkyRepeaterItemComponent,
1464
+ SkyRepeaterItemContentComponent,
1465
+ SkyRepeaterItemContextMenuComponent,
1466
+ SkyRepeaterItemTitleComponent,
1467
+ ],
1468
+ providers: [DragulaService],
1469
+ }]
1470
+ }] });
1471
+
1472
+ /**
1473
+ * @internal
1474
+ */
1475
+ class SkySortService {
1476
+ constructor() {
1477
+ this.selectedItem = new BehaviorSubject('');
1478
+ }
1479
+ selectItem(sortItem) {
1480
+ this.selectedItem.next(sortItem);
1481
+ }
1482
+ }
1483
+ SkySortService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
1484
+ SkySortService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortService });
1485
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortService, decorators: [{
1486
+ type: Injectable
1487
+ }] });
1488
+
1489
+ const SORT_ITEM_ID_PREFIX = 'sky-sort-item-';
1490
+ let sortItemIdNumber = 0;
1491
+ class SkySortItemComponent {
1492
+ constructor(sortService, detector) {
1493
+ this.sortService = sortService;
1494
+ this.detector = detector;
1495
+ /**
1496
+ * Fires when a sort item is selected.
1497
+ */
1498
+ this.itemSelect = new EventEmitter();
1499
+ this.isSelected = new BehaviorSubject(false);
1500
+ }
1501
+ ngOnInit() {
1502
+ sortItemIdNumber++;
1503
+ this.sortItemId = SORT_ITEM_ID_PREFIX + sortItemIdNumber.toString();
1504
+ this.subscription = this.sortService.selectedItem.subscribe((itemId) => {
1505
+ this.isSelected.next(itemId === this.sortItemId);
1506
+ this.detector.detectChanges();
1507
+ });
1508
+ if (this.active) {
1509
+ this.sortService.selectItem(this.sortItemId);
1510
+ }
1511
+ }
1512
+ ngOnChanges(changes) {
1513
+ if (changes &&
1514
+ changes['active'] &&
1515
+ changes['active'].currentValue &&
1516
+ changes['active'].currentValue !== changes['active'].previousValue) {
1517
+ this.sortService.selectItem(this.sortItemId);
1518
+ }
1519
+ }
1520
+ itemClicked() {
1521
+ this.sortService.selectItem(this.sortItemId);
1522
+ this.itemSelect.emit();
1523
+ }
1524
+ ngOnDestroy() {
1525
+ /* istanbul ignore else */
1526
+ /* sanity check */
1527
+ if (this.subscription) {
1528
+ this.subscription.unsubscribe();
1529
+ }
1530
+ }
1531
+ }
1532
+ SkySortItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortItemComponent, deps: [{ token: SkySortService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1533
+ SkySortItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkySortItemComponent, selector: "sky-sort-item", inputs: { active: "active" }, outputs: { itemSelect: "itemSelect" }, usesOnChanges: true, ngImport: i0, template: "<div\n class=\"sky-sort-item\"\n role=\"menuitemradio\"\n [attr.aria-checked]=\"isSelected | async\"\n [ngClass]=\"{ 'sky-sort-item-selected': (isSelected | async) }\"\n>\n <button\n type=\"button\"\n [ngClass]=\"{ 'sky-emphasized': (isSelected | async) }\"\n (click)=\"itemClicked()\"\n >\n <ng-content></ng-content>\n </button>\n</div>\n", styles: [".sky-sort-item{background-color:transparent;border:none;display:block;margin:4px;min-width:160px;text-align:left;transition:background-color .15s}.sky-sort-item.sky-dropdown-item-active,.sky-sort-item:hover{background-color:#eeeeef}.sky-sort-item.sky-dropdown-item-disabled{cursor:default}.sky-sort-item.sky-dropdown-item-disabled:hover{background-color:transparent}.sky-sort-item ::ng-deep>button{background-color:transparent;border:none;color:#212327;cursor:pointer;display:block;padding:3px 20px;text-align:left;width:100%}.sky-sort-item ::ng-deep>button[disabled]{color:#686c73}.sky-sort-item ::ng-deep>button[disabled]:hover{cursor:default}.sky-sort-item-selected{background-color:#f1eef6;padding:4px;margin:0}:host-context(.sky-theme-modern) .sky-sort-item{margin:0 0 10px;border:none;border-radius:0;font-weight:400;transition:box-shadow .15s;padding:10px 20px}:host-context(.sky-theme-modern) .sky-sort-item:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus){background-color:transparent;border-bottom:solid 1px #00b4f1;padding-bottom:9px}:host-context(.sky-theme-modern) .sky-sort-item:focus{background-color:transparent;outline:none}:host-context(.sky-theme-modern) .sky-sort-item:focus:not(:active){outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-sort-item:active{border-bottom:solid 3px #00b4f1;padding-bottom:7px}:host-context(.sky-theme-modern) .sky-sort-item:hover:not(.sky-btn-tab-disabled){background-color:transparent;border-bottom:none;outline:solid 1px #1870B8;outline-offset:-1px}:host-context(.sky-theme-modern) .sky-sort-item:focus:not(:active){background-color:transparent;box-shadow:0 1px 8px #0000004d;outline:solid 2px #1870B8;outline-offset:-2px}:host-context(.sky-theme-modern) .sky-sort-item button{padding:0;color:#686c73}:host-context(.sky-theme-modern) .sky-sort-item-selected{color:#212327;border-bottom:none;border-left:solid 3px #1870B8;padding-bottom:10px;padding-left:17px;background-color:inherit}:host-context(.sky-theme-modern) .sky-sort-item-selected button{font-weight:400;color:#212327}.sky-theme-modern .sky-sort-item{margin:0 0 10px;border:none;border-radius:0;font-weight:400;transition:box-shadow .15s;padding:10px 20px}.sky-theme-modern .sky-sort-item:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus){background-color:transparent;border-bottom:solid 1px #00b4f1;padding-bottom:9px}.sky-theme-modern .sky-sort-item:focus{background-color:transparent;outline:none}.sky-theme-modern .sky-sort-item:focus:not(:active){outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-sort-item:active{border-bottom:solid 3px #00b4f1;padding-bottom:7px}.sky-theme-modern .sky-sort-item:hover:not(.sky-btn-tab-disabled){background-color:transparent;border-bottom:none;outline:solid 1px #1870B8;outline-offset:-1px}.sky-theme-modern .sky-sort-item:focus:not(:active){background-color:transparent;box-shadow:0 1px 8px #0000004d;outline:solid 2px #1870B8;outline-offset:-2px}.sky-theme-modern .sky-sort-item button{padding:0;color:#686c73}.sky-theme-modern .sky-sort-item-selected{color:#212327;border-bottom:none;border-left:solid 3px #1870B8;padding-bottom:10px;padding-left:17px;background-color:inherit}.sky-theme-modern .sky-sort-item-selected button{font-weight:400;color:#212327}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-sort-item button{color:#c0c2c5}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-sort-item-selected button{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark .sky-sort-item button{color:#c0c2c5}.sky-theme-modern.sky-theme-mode-dark .sky-sort-item-selected button{color:#fbfcfe}\n"], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i2.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
1534
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortItemComponent, decorators: [{
1535
+ type: Component,
1536
+ args: [{ selector: 'sky-sort-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"sky-sort-item\"\n role=\"menuitemradio\"\n [attr.aria-checked]=\"isSelected | async\"\n [ngClass]=\"{ 'sky-sort-item-selected': (isSelected | async) }\"\n>\n <button\n type=\"button\"\n [ngClass]=\"{ 'sky-emphasized': (isSelected | async) }\"\n (click)=\"itemClicked()\"\n >\n <ng-content></ng-content>\n </button>\n</div>\n", styles: [".sky-sort-item{background-color:transparent;border:none;display:block;margin:4px;min-width:160px;text-align:left;transition:background-color .15s}.sky-sort-item.sky-dropdown-item-active,.sky-sort-item:hover{background-color:#eeeeef}.sky-sort-item.sky-dropdown-item-disabled{cursor:default}.sky-sort-item.sky-dropdown-item-disabled:hover{background-color:transparent}.sky-sort-item ::ng-deep>button{background-color:transparent;border:none;color:#212327;cursor:pointer;display:block;padding:3px 20px;text-align:left;width:100%}.sky-sort-item ::ng-deep>button[disabled]{color:#686c73}.sky-sort-item ::ng-deep>button[disabled]:hover{cursor:default}.sky-sort-item-selected{background-color:#f1eef6;padding:4px;margin:0}:host-context(.sky-theme-modern) .sky-sort-item{margin:0 0 10px;border:none;border-radius:0;font-weight:400;transition:box-shadow .15s;padding:10px 20px}:host-context(.sky-theme-modern) .sky-sort-item:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus){background-color:transparent;border-bottom:solid 1px #00b4f1;padding-bottom:9px}:host-context(.sky-theme-modern) .sky-sort-item:focus{background-color:transparent;outline:none}:host-context(.sky-theme-modern) .sky-sort-item:focus:not(:active){outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-sort-item:active{border-bottom:solid 3px #00b4f1;padding-bottom:7px}:host-context(.sky-theme-modern) .sky-sort-item:hover:not(.sky-btn-tab-disabled){background-color:transparent;border-bottom:none;outline:solid 1px #1870B8;outline-offset:-1px}:host-context(.sky-theme-modern) .sky-sort-item:focus:not(:active){background-color:transparent;box-shadow:0 1px 8px #0000004d;outline:solid 2px #1870B8;outline-offset:-2px}:host-context(.sky-theme-modern) .sky-sort-item button{padding:0;color:#686c73}:host-context(.sky-theme-modern) .sky-sort-item-selected{color:#212327;border-bottom:none;border-left:solid 3px #1870B8;padding-bottom:10px;padding-left:17px;background-color:inherit}:host-context(.sky-theme-modern) .sky-sort-item-selected button{font-weight:400;color:#212327}.sky-theme-modern .sky-sort-item{margin:0 0 10px;border:none;border-radius:0;font-weight:400;transition:box-shadow .15s;padding:10px 20px}.sky-theme-modern .sky-sort-item:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus){background-color:transparent;border-bottom:solid 1px #00b4f1;padding-bottom:9px}.sky-theme-modern .sky-sort-item:focus{background-color:transparent;outline:none}.sky-theme-modern .sky-sort-item:focus:not(:active){outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-sort-item:active{border-bottom:solid 3px #00b4f1;padding-bottom:7px}.sky-theme-modern .sky-sort-item:hover:not(.sky-btn-tab-disabled){background-color:transparent;border-bottom:none;outline:solid 1px #1870B8;outline-offset:-1px}.sky-theme-modern .sky-sort-item:focus:not(:active){background-color:transparent;box-shadow:0 1px 8px #0000004d;outline:solid 2px #1870B8;outline-offset:-2px}.sky-theme-modern .sky-sort-item button{padding:0;color:#686c73}.sky-theme-modern .sky-sort-item-selected{color:#212327;border-bottom:none;border-left:solid 3px #1870B8;padding-bottom:10px;padding-left:17px;background-color:inherit}.sky-theme-modern .sky-sort-item-selected button{font-weight:400;color:#212327}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-sort-item button{color:#c0c2c5}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-sort-item-selected button{color:#fbfcfe}.sky-theme-modern.sky-theme-mode-dark .sky-sort-item button{color:#c0c2c5}.sky-theme-modern.sky-theme-mode-dark .sky-sort-item-selected button{color:#fbfcfe}\n"] }]
1537
+ }], ctorParameters: function () { return [{ type: SkySortService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { active: [{
1538
+ type: Input
1539
+ }], itemSelect: [{
1540
+ type: Output
1541
+ }] } });
1542
+
1543
+ class SkySortMenuHeadingComponent {
1544
+ }
1545
+ SkySortMenuHeadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortMenuHeadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1546
+ SkySortMenuHeadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkySortMenuHeadingComponent, selector: "sky-sort-menu-heading", ngImport: i0, template: "<div\n class=\"sky-sort-menu-heading\"\n [skyThemeClass]=\"{\n 'sky-subsection-heading': 'default',\n 'sky-font-heading-4': 'modern'\n }\"\n>\n {{ 'skyux_sort_menu_heading' | skyLibResources }}\n</div>\n", styles: [".sky-sort-menu-heading{background-color:transparent;border:none;display:block;margin:4px;min-width:160px;transition:background-color .15s;padding:3px 20px;text-align:left;width:100%}:host-context(.sky-theme-modern) .sky-sort-menu-heading{margin:10px 0 0;padding:10px 20px}.sky-theme-modern .sky-sort-menu-heading{margin:10px 0 0;padding:10px 20px}\n"], directives: [{ type: i3.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe } });
1547
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortMenuHeadingComponent, decorators: [{
1548
+ type: Component,
1549
+ args: [{ selector: 'sky-sort-menu-heading', template: "<div\n class=\"sky-sort-menu-heading\"\n [skyThemeClass]=\"{\n 'sky-subsection-heading': 'default',\n 'sky-font-heading-4': 'modern'\n }\"\n>\n {{ 'skyux_sort_menu_heading' | skyLibResources }}\n</div>\n", styles: [".sky-sort-menu-heading{background-color:transparent;border:none;display:block;margin:4px;min-width:160px;transition:background-color .15s;padding:3px 20px;text-align:left;width:100%}:host-context(.sky-theme-modern) .sky-sort-menu-heading{margin:10px 0 0;padding:10px 20px}.sky-theme-modern .sky-sort-menu-heading{margin:10px 0 0;padding:10px 20px}\n"] }]
1550
+ }] });
1551
+
1552
+ class SkySortComponent {
1553
+ constructor() {
1554
+ /**
1555
+ * Indicates whether to display a "Sort" label beside the icon on the sort button.
1556
+ */
1557
+ this.showButtonText = false;
1558
+ this.dropdownController = new Subject();
1559
+ }
1560
+ dropdownClicked() {
1561
+ this.dropdownController.next({
1562
+ type: SkyDropdownMessageType.Close,
1563
+ });
1564
+ }
1565
+ }
1566
+ SkySortComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1567
+ SkySortComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkySortComponent, selector: "sky-sort", inputs: { showButtonText: "showButtonText" }, providers: [SkySortService], ngImport: i0, template: "<div class=\"sky-sort\">\n <sky-dropdown\n buttonType=\"select\"\n [label]=\"'skyux_sort_button_label' | skyLibResources\"\n [messageStream]=\"dropdownController\"\n [title]=\"'skyux_sort_button_label' | skyLibResources\"\n >\n <sky-dropdown-button>\n <sky-icon *skyThemeIf=\"'default'\" icon=\"sort\"></sky-icon>\n <sky-icon *skyThemeIf=\"'modern'\" icon=\"sort\" iconType=\"skyux\"></sky-icon>\n <span *ngIf=\"showButtonText\" class=\"sky-sort-btn-text\">\n {{ 'skyux_sort_button_label' | skyLibResources }}\n </span>\n </sky-dropdown-button>\n <sky-dropdown-menu\n ariaRole=\"menu\"\n [ariaLabelledBy]=\"sortMenuHeading.id\"\n (click)=\"dropdownClicked()\"\n >\n <sky-sort-menu-heading\n skyId\n #sortMenuHeading=\"skyId\"\n ></sky-sort-menu-heading>\n <div *skyThemeIf=\"'default'\" class=\"sky-sort-heading-divider\"></div>\n <ng-content></ng-content>\n </sky-dropdown-menu>\n </sky-dropdown>\n</div>\n", styles: [".sky-sort-heading-divider{margin:0;height:1px;overflow:hidden;background-color:#eeeeef}:host .sky-sort-btn-text{display:none}:host .sky-sort ::ng-deep .sky-dropdown-caret{display:none}:host-context(.sky-responsive-container-xs) .sky-sort-btn-text,:host-context(.sky-responsive-container-sm) .sky-sort-btn-text,:host-context(.sky-responsive-container-md) .sky-sort-btn-text,:host-context(.sky-responsive-container-lg) .sky-sort-btn-text{display:none}:host-context(.sky-responsive-container-xs) .sky-sort ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-sm) .sky-sort ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-md) .sky-sort ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-lg) .sky-sort ::ng-deep .sky-dropdown-caret{display:none}@media (min-width: 768px){:host .sky-sort-btn-text{display:inline}:host .sky-sort ::ng-deep .sky-dropdown-caret{display:inline-block}}:host-context(.sky-responsive-container-sm) .sky-sort-btn-text,:host-context(.sky-responsive-container-md) .sky-sort-btn-text,:host-context(.sky-responsive-container-lg) .sky-sort-btn-text{display:inline}:host-context(.sky-responsive-container-sm) .sky-sort ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-md) .sky-sort ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-lg) .sky-sort ::ng-deep .sky-dropdown-caret{display:inline-block}\n"], components: [{ type: i1$2.λ3, selector: "sky-dropdown", inputs: ["buttonStyle", "buttonType", "disabled", "dismissOnBlur", "label", "horizontalAlignment", "messageStream", "title", "trigger"] }, { type: i1$2.λ2, selector: "sky-dropdown-button" }, { type: i1.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { type: i1$2.λ4, selector: "sky-dropdown-menu", inputs: ["ariaLabelledBy", "ariaRole", "useNativeFocus"], outputs: ["menuChanges"] }, { type: SkySortMenuHeadingComponent, selector: "sky-sort-menu-heading" }], directives: [{ type: i3.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.λ2, selector: "[skyId]", exportAs: ["skyId"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
1568
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortComponent, decorators: [{
1569
+ type: Component,
1570
+ args: [{ selector: 'sky-sort', providers: [SkySortService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-sort\">\n <sky-dropdown\n buttonType=\"select\"\n [label]=\"'skyux_sort_button_label' | skyLibResources\"\n [messageStream]=\"dropdownController\"\n [title]=\"'skyux_sort_button_label' | skyLibResources\"\n >\n <sky-dropdown-button>\n <sky-icon *skyThemeIf=\"'default'\" icon=\"sort\"></sky-icon>\n <sky-icon *skyThemeIf=\"'modern'\" icon=\"sort\" iconType=\"skyux\"></sky-icon>\n <span *ngIf=\"showButtonText\" class=\"sky-sort-btn-text\">\n {{ 'skyux_sort_button_label' | skyLibResources }}\n </span>\n </sky-dropdown-button>\n <sky-dropdown-menu\n ariaRole=\"menu\"\n [ariaLabelledBy]=\"sortMenuHeading.id\"\n (click)=\"dropdownClicked()\"\n >\n <sky-sort-menu-heading\n skyId\n #sortMenuHeading=\"skyId\"\n ></sky-sort-menu-heading>\n <div *skyThemeIf=\"'default'\" class=\"sky-sort-heading-divider\"></div>\n <ng-content></ng-content>\n </sky-dropdown-menu>\n </sky-dropdown>\n</div>\n", styles: [".sky-sort-heading-divider{margin:0;height:1px;overflow:hidden;background-color:#eeeeef}:host .sky-sort-btn-text{display:none}:host .sky-sort ::ng-deep .sky-dropdown-caret{display:none}:host-context(.sky-responsive-container-xs) .sky-sort-btn-text,:host-context(.sky-responsive-container-sm) .sky-sort-btn-text,:host-context(.sky-responsive-container-md) .sky-sort-btn-text,:host-context(.sky-responsive-container-lg) .sky-sort-btn-text{display:none}:host-context(.sky-responsive-container-xs) .sky-sort ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-sm) .sky-sort ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-md) .sky-sort ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-lg) .sky-sort ::ng-deep .sky-dropdown-caret{display:none}@media (min-width: 768px){:host .sky-sort-btn-text{display:inline}:host .sky-sort ::ng-deep .sky-dropdown-caret{display:inline-block}}:host-context(.sky-responsive-container-sm) .sky-sort-btn-text,:host-context(.sky-responsive-container-md) .sky-sort-btn-text,:host-context(.sky-responsive-container-lg) .sky-sort-btn-text{display:inline}:host-context(.sky-responsive-container-sm) .sky-sort ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-md) .sky-sort ::ng-deep .sky-dropdown-caret,:host-context(.sky-responsive-container-lg) .sky-sort ::ng-deep .sky-dropdown-caret{display:inline-block}\n"] }]
1571
+ }], propDecorators: { showButtonText: [{
1572
+ type: Input
1573
+ }] } });
1574
+
1575
+ class SkySortModule {
1576
+ }
1577
+ SkySortModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1578
+ SkySortModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortModule, declarations: [SkySortComponent,
1579
+ SkySortItemComponent,
1580
+ SkySortMenuHeadingComponent], imports: [CommonModule,
1581
+ SkyDropdownModule,
1582
+ SkyIconModule,
1583
+ SkyIdModule,
1584
+ SkyListsResourcesModule,
1585
+ SkyThemeModule], exports: [SkySortComponent, SkySortItemComponent] });
1586
+ SkySortModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortModule, imports: [[
1587
+ CommonModule,
1588
+ SkyDropdownModule,
1589
+ SkyIconModule,
1590
+ SkyIdModule,
1591
+ SkyListsResourcesModule,
1592
+ SkyThemeModule,
1593
+ ]] });
1594
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkySortModule, decorators: [{
1595
+ type: NgModule,
1596
+ args: [{
1597
+ declarations: [
1598
+ SkySortComponent,
1599
+ SkySortItemComponent,
1600
+ SkySortMenuHeadingComponent,
1601
+ ],
1602
+ imports: [
1603
+ CommonModule,
1604
+ SkyDropdownModule,
1605
+ SkyIconModule,
1606
+ SkyIdModule,
1607
+ SkyListsResourcesModule,
1608
+ SkyThemeModule,
1609
+ ],
1610
+ exports: [SkySortComponent, SkySortItemComponent],
1611
+ }]
1612
+ }] });
1613
+
1614
+ /**
1615
+ * Generated bundle index. Do not edit.
1616
+ */
1617
+
1618
+ export { SkyFilterModule, SkyInfiniteScrollModule, SkyPagingModule, SkyRepeaterModule, SkySortModule, SkyFilterButtonComponent as λ1, SkyRepeaterItemComponent as λ10, SkyRepeaterComponent as λ11, SkyRepeaterItemTitleComponent as λ12, SkySortItemComponent as λ13, SkySortComponent as λ14, SkyFilterInlineComponent as λ2, SkyFilterInlineItemComponent as λ3, SkyFilterSummaryItemComponent as λ4, SkyFilterSummaryComponent as λ5, SkyInfiniteScrollComponent as λ6, SkyPagingComponent as λ7, SkyRepeaterItemContentComponent as λ8, SkyRepeaterItemContextMenuComponent as λ9 };
1619
+ //# sourceMappingURL=skyux-lists.mjs.map