@skyux/lists 5.0.2 → 5.1.0
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.
- package/bundles/skyux-lists-testing.umd.js +26 -39
- package/bundles/skyux-lists.umd.js +184 -205
- package/documentation.json +402 -363
- package/esm2015/modules/filter/filter-button.component.js +6 -6
- package/esm2015/modules/filter/filter-inline-item.component.js +5 -5
- package/esm2015/modules/filter/filter-inline.component.js +5 -5
- package/esm2015/modules/filter/filter-summary-item.component.js +6 -6
- package/esm2015/modules/filter/filter-summary.component.js +5 -5
- package/esm2015/modules/filter/filter.module.js +10 -10
- package/esm2015/modules/infinite-scroll/infinite-scroll-dom-adapter.service.js +11 -12
- package/esm2015/modules/infinite-scroll/infinite-scroll.component.js +10 -12
- package/esm2015/modules/infinite-scroll/infinite-scroll.module.js +8 -22
- package/esm2015/modules/paging/paging.component.js +9 -10
- package/esm2015/modules/paging/paging.module.js +9 -13
- package/esm2015/modules/repeater/repeater-adapter.service.js +4 -4
- package/esm2015/modules/repeater/repeater-item-content.component.js +5 -5
- package/esm2015/modules/repeater/repeater-item-context-menu.component.js +5 -5
- package/esm2015/modules/repeater/repeater-item-title.component.js +5 -5
- package/esm2015/modules/repeater/repeater-item.component.js +21 -14
- package/esm2015/modules/repeater/repeater.component.js +18 -17
- package/esm2015/modules/repeater/repeater.module.js +10 -10
- package/esm2015/modules/repeater/repeater.service.js +5 -5
- package/esm2015/modules/shared/sky-lists-resources.module.js +6 -6
- package/esm2015/modules/sort/sort-item.component.js +10 -9
- package/esm2015/modules/sort/sort-menu-heading.component.js +5 -5
- package/esm2015/modules/sort/sort.component.js +8 -12
- package/esm2015/modules/sort/sort.module.js +10 -14
- package/esm2015/modules/sort/sort.service.js +4 -4
- package/esm2015/testing/filter/filter-fixture-button.js +2 -2
- package/esm2015/testing/filter/filter-fixture-summary.js +1 -1
- package/esm2015/testing/filter/filter-testing.module.js +6 -8
- package/esm2015/testing/infinite-scroll/infinite-scroll-fixture.js +1 -1
- package/esm2015/testing/infinite-scroll/infinite-scroll-testing.module.js +6 -8
- package/esm2015/testing/paging/paging-fixture.js +2 -2
- package/esm2015/testing/paging/paging-testing.module.js +6 -8
- package/esm2015/testing/sort/sort-fixture.js +5 -6
- package/esm2015/testing/sort/sort-testing.module.js +7 -13
- package/fesm2015/skyux-lists-testing.js +27 -40
- package/fesm2015/skyux-lists-testing.js.map +1 -1
- package/fesm2015/skyux-lists.js +167 -188
- package/fesm2015/skyux-lists.js.map +1 -1
- package/modules/repeater/repeater-item.component.d.ts +8 -1
- package/package.json +12 -12
- package/bundles/skyux-lists-testing.umd.js.map +0 -1
- package/bundles/skyux-lists.umd.js.map +0 -1
package/fesm2015/skyux-lists.js
CHANGED
|
@@ -29,7 +29,7 @@ import { SkyDropdownMessageType, SkyDropdownModule } from '@skyux/popovers';
|
|
|
29
29
|
* To update this file, simply rerun the command.
|
|
30
30
|
*/
|
|
31
31
|
const RESOURCES = {
|
|
32
|
-
'EN-US': { "skyux_filter_button_title": { "message": "Filter" }, "skyux_filter_summary_close": { "message": "Remove filter" }, "skyux_filter_summary_header": { "message": "Filter" }, "skyux_infinite_scroll_load_more_button": { "message": "Load more" }, "skyux_paging_label": { "message": "Pagination" }, "skyux_paging_next": { "message": "Next" }, "skyux_paging_previous": { "message": "Previous" }, "skyux_repeater_label": { "message": "List of items" }, "skyux_repeater_item_checkbox_label": { "message": "Select row" }, "skyux_repeater_item_reorder_cancel": { "message": "Item reordering was canceled. The item was returned to its original position." }, "skyux_repeater_item_reorder_finish": { "message": "Dropped the item in position" }, "skyux_repeater_item_reorder_instructions": { "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." }, "skyux_repeater_item_reorder_moved": { "message": "Moved the item to position" }, "skyux_repeater_item_reorder_operation": { "message": "Press the spacebar or enter key to reorder." }, "skyux_repeater_item_reorder_top": { "message": "Top" }, "skyux_repeater_item_reorder_top_label": { "message": "Move to top" }, "skyux_sort_button_label": { "message": "Sort" }, "skyux_sort_menu_heading": { "message": "Sort by" } },
|
|
32
|
+
'EN-US': { "skyux_filter_button_title": { "message": "Filter" }, "skyux_filter_summary_close": { "message": "Remove filter" }, "skyux_filter_summary_header": { "message": "Filter" }, "skyux_infinite_scroll_load_more_button": { "message": "Load more" }, "skyux_paging_label": { "message": "Pagination" }, "skyux_paging_next": { "message": "Next" }, "skyux_paging_previous": { "message": "Previous" }, "skyux_repeater_label": { "message": "List of items" }, "skyux_repeater_item_expand": { "message": "Expand or collapse {0}" }, "skyux_repeater_item_expand_default": { "message": "Expand or collapse" }, "skyux_repeater_item_checkbox_label": { "message": "Select {0}" }, "skyux_repeater_item_checkbox_label_default": { "message": "Select row" }, "skyux_repeater_item_reorder_cancel": { "message": "Item reordering was canceled. The item was returned to its original position." }, "skyux_repeater_item_reorder_finish": { "message": "Dropped the item in position" }, "skyux_repeater_item_reorder_instructions": { "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." }, "skyux_repeater_item_reorder_moved": { "message": "Moved the item to position" }, "skyux_repeater_item_reorder_label_default": { "message": "Reorder" }, "skyux_repeater_item_reorder_label": { "message": "Reorder {0}" }, "skyux_repeater_item_reorder_operation": { "message": "Press the spacebar or enter key to reorder." }, "skyux_repeater_item_reorder_top": { "message": "Top" }, "skyux_repeater_item_reorder_top_label": { "message": "Move {0} to top" }, "skyux_repeater_item_reorder_top_label_default": { "message": "Move to top" }, "skyux_sort_button_label": { "message": "Sort" }, "skyux_sort_menu_heading": { "message": "Sort by" } },
|
|
33
33
|
};
|
|
34
34
|
class SkyListsResourcesProvider {
|
|
35
35
|
getString(localeInfo, name) {
|
|
@@ -41,14 +41,14 @@ class SkyListsResourcesProvider {
|
|
|
41
41
|
*/
|
|
42
42
|
class SkyListsResourcesModule {
|
|
43
43
|
}
|
|
44
|
-
SkyListsResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
45
|
-
SkyListsResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.
|
|
46
|
-
SkyListsResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.
|
|
44
|
+
SkyListsResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyListsResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
45
|
+
SkyListsResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyListsResourcesModule, exports: [SkyI18nModule] });
|
|
46
|
+
SkyListsResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyListsResourcesModule, providers: [{
|
|
47
47
|
provide: SKY_LIB_RESOURCES_PROVIDERS,
|
|
48
48
|
useClass: SkyListsResourcesProvider,
|
|
49
49
|
multi: true
|
|
50
50
|
}], imports: [SkyI18nModule] });
|
|
51
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
51
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyListsResourcesModule, decorators: [{
|
|
52
52
|
type: NgModule,
|
|
53
53
|
args: [{
|
|
54
54
|
exports: [SkyI18nModule],
|
|
@@ -95,15 +95,15 @@ class SkyFilterButtonComponent {
|
|
|
95
95
|
this.filterButtonClick.emit(undefined);
|
|
96
96
|
}
|
|
97
97
|
}
|
|
98
|
-
SkyFilterButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
99
|
-
SkyFilterButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
100
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
98
|
+
SkyFilterButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
99
|
+
SkyFilterButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", 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 });
|
|
100
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterButtonComponent, decorators: [{
|
|
101
101
|
type: Component,
|
|
102
102
|
args: [{
|
|
103
103
|
selector: 'sky-filter-button',
|
|
104
104
|
styleUrls: ['./filter-button.component.scss'],
|
|
105
105
|
templateUrl: './filter-button.component.html',
|
|
106
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
106
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
107
107
|
}]
|
|
108
108
|
}], propDecorators: { filterButtonId: [{
|
|
109
109
|
type: Input
|
|
@@ -126,14 +126,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
126
126
|
*/
|
|
127
127
|
class SkyFilterInlineComponent {
|
|
128
128
|
}
|
|
129
|
-
SkyFilterInlineComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
130
|
-
SkyFilterInlineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
131
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
129
|
+
SkyFilterInlineComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterInlineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
130
|
+
SkyFilterInlineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", 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"] });
|
|
131
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterInlineComponent, decorators: [{
|
|
132
132
|
type: Component,
|
|
133
133
|
args: [{
|
|
134
134
|
selector: 'sky-filter-inline',
|
|
135
135
|
styleUrls: ['./filter-inline.component.scss'],
|
|
136
|
-
templateUrl: './filter-inline.component.html'
|
|
136
|
+
templateUrl: './filter-inline.component.html',
|
|
137
137
|
}]
|
|
138
138
|
}] });
|
|
139
139
|
|
|
@@ -142,14 +142,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
142
142
|
*/
|
|
143
143
|
class SkyFilterInlineItemComponent {
|
|
144
144
|
}
|
|
145
|
-
SkyFilterInlineItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
146
|
-
SkyFilterInlineItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
147
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
145
|
+
SkyFilterInlineItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterInlineItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
146
|
+
SkyFilterInlineItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", 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"] });
|
|
147
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterInlineItemComponent, decorators: [{
|
|
148
148
|
type: Component,
|
|
149
149
|
args: [{
|
|
150
150
|
selector: 'sky-filter-inline-item',
|
|
151
151
|
styleUrls: ['./filter-inline-item.component.scss'],
|
|
152
|
-
templateUrl: './filter-inline-item.component.html'
|
|
152
|
+
templateUrl: './filter-inline-item.component.html',
|
|
153
153
|
}]
|
|
154
154
|
}] });
|
|
155
155
|
|
|
@@ -181,15 +181,15 @@ class SkyFilterSummaryItemComponent {
|
|
|
181
181
|
this.itemClick.emit();
|
|
182
182
|
}
|
|
183
183
|
}
|
|
184
|
-
SkyFilterSummaryItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
185
|
-
SkyFilterSummaryItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
186
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
184
|
+
SkyFilterSummaryItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterSummaryItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
185
|
+
SkyFilterSummaryItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", 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 });
|
|
186
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterSummaryItemComponent, decorators: [{
|
|
187
187
|
type: Component,
|
|
188
188
|
args: [{
|
|
189
189
|
selector: 'sky-filter-summary-item',
|
|
190
190
|
styleUrls: ['./filter-summary-item.component.scss'],
|
|
191
191
|
templateUrl: './filter-summary-item.component.html',
|
|
192
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
192
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
193
193
|
}]
|
|
194
194
|
}], propDecorators: { dismissible: [{
|
|
195
195
|
type: Input
|
|
@@ -204,22 +204,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
204
204
|
*/
|
|
205
205
|
class SkyFilterSummaryComponent {
|
|
206
206
|
}
|
|
207
|
-
SkyFilterSummaryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
208
|
-
SkyFilterSummaryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
209
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
207
|
+
SkyFilterSummaryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
208
|
+
SkyFilterSummaryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", 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 });
|
|
209
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterSummaryComponent, decorators: [{
|
|
210
210
|
type: Component,
|
|
211
211
|
args: [{
|
|
212
212
|
selector: 'sky-filter-summary',
|
|
213
213
|
styleUrls: ['./filter-summary.component.scss'],
|
|
214
214
|
templateUrl: './filter-summary.component.html',
|
|
215
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
215
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
216
216
|
}]
|
|
217
217
|
}] });
|
|
218
218
|
|
|
219
219
|
class SkyFilterModule {
|
|
220
220
|
}
|
|
221
|
-
SkyFilterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
222
|
-
SkyFilterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.
|
|
221
|
+
SkyFilterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
222
|
+
SkyFilterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterModule, declarations: [SkyFilterButtonComponent,
|
|
223
223
|
SkyFilterInlineComponent,
|
|
224
224
|
SkyFilterInlineItemComponent,
|
|
225
225
|
SkyFilterSummaryComponent,
|
|
@@ -232,14 +232,14 @@ SkyFilterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version
|
|
|
232
232
|
SkyFilterInlineItemComponent,
|
|
233
233
|
SkyFilterSummaryComponent,
|
|
234
234
|
SkyFilterSummaryItemComponent] });
|
|
235
|
-
SkyFilterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.
|
|
235
|
+
SkyFilterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterModule, imports: [[
|
|
236
236
|
CommonModule,
|
|
237
237
|
SkyIconModule,
|
|
238
238
|
SkyListsResourcesModule,
|
|
239
239
|
SkyTokensModule,
|
|
240
|
-
SkyThemeModule
|
|
240
|
+
SkyThemeModule,
|
|
241
241
|
]] });
|
|
242
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
242
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyFilterModule, decorators: [{
|
|
243
243
|
type: NgModule,
|
|
244
244
|
args: [{
|
|
245
245
|
declarations: [
|
|
@@ -247,22 +247,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
247
247
|
SkyFilterInlineComponent,
|
|
248
248
|
SkyFilterInlineItemComponent,
|
|
249
249
|
SkyFilterSummaryComponent,
|
|
250
|
-
SkyFilterSummaryItemComponent
|
|
250
|
+
SkyFilterSummaryItemComponent,
|
|
251
251
|
],
|
|
252
252
|
imports: [
|
|
253
253
|
CommonModule,
|
|
254
254
|
SkyIconModule,
|
|
255
255
|
SkyListsResourcesModule,
|
|
256
256
|
SkyTokensModule,
|
|
257
|
-
SkyThemeModule
|
|
257
|
+
SkyThemeModule,
|
|
258
258
|
],
|
|
259
259
|
exports: [
|
|
260
260
|
SkyFilterButtonComponent,
|
|
261
261
|
SkyFilterInlineComponent,
|
|
262
262
|
SkyFilterInlineItemComponent,
|
|
263
263
|
SkyFilterSummaryComponent,
|
|
264
|
-
SkyFilterSummaryItemComponent
|
|
265
|
-
]
|
|
264
|
+
SkyFilterSummaryItemComponent,
|
|
265
|
+
],
|
|
266
266
|
}]
|
|
267
267
|
}] });
|
|
268
268
|
|
|
@@ -296,8 +296,7 @@ class SkyInfiniteScrollDomAdapterService {
|
|
|
296
296
|
*/
|
|
297
297
|
scrollTo(elementRef) {
|
|
298
298
|
const parent = this.findScrollableParent(elementRef.nativeElement);
|
|
299
|
-
return fromEvent(parent, 'scroll')
|
|
300
|
-
.pipe(takeUntil(this.ngUnsubscribe), filter(() => {
|
|
299
|
+
return fromEvent(parent, 'scroll').pipe(takeUntil(this.ngUnsubscribe), filter(() => {
|
|
301
300
|
return this.isElementScrolledInView(elementRef.nativeElement, parent);
|
|
302
301
|
}), map(() => undefined) // Change to void return type
|
|
303
302
|
);
|
|
@@ -305,8 +304,7 @@ class SkyInfiniteScrollDomAdapterService {
|
|
|
305
304
|
createObserver(element) {
|
|
306
305
|
this.observer = new MutationObserver((mutations) => {
|
|
307
306
|
const hasUpdates = !!mutations.find((mutation) => {
|
|
308
|
-
return (!element.contains(mutation.target) &&
|
|
309
|
-
mutation.addedNodes.length > 0);
|
|
307
|
+
return (!element.contains(mutation.target) && mutation.addedNodes.length > 0);
|
|
310
308
|
});
|
|
311
309
|
if (hasUpdates) {
|
|
312
310
|
this._parentChanges.emit();
|
|
@@ -314,10 +312,10 @@ class SkyInfiniteScrollDomAdapterService {
|
|
|
314
312
|
});
|
|
315
313
|
const windowObj = this.windowRef.nativeWindow;
|
|
316
314
|
const parent = this.findScrollableParent(element);
|
|
317
|
-
const observedParent =
|
|
315
|
+
const observedParent = parent === windowObj ? windowObj.document.body : parent;
|
|
318
316
|
this.observer.observe(observedParent, {
|
|
319
317
|
childList: true,
|
|
320
|
-
subtree: true
|
|
318
|
+
subtree: true,
|
|
321
319
|
});
|
|
322
320
|
}
|
|
323
321
|
findScrollableParent(element) {
|
|
@@ -341,16 +339,17 @@ class SkyInfiniteScrollDomAdapterService {
|
|
|
341
339
|
isElementScrolledInView(element, parentElement) {
|
|
342
340
|
const windowObj = this.windowRef.nativeWindow;
|
|
343
341
|
if (parentElement === windowObj) {
|
|
344
|
-
return (parentElement.pageYOffset + parentElement.innerHeight >
|
|
342
|
+
return (parentElement.pageYOffset + parentElement.innerHeight >
|
|
343
|
+
element.offsetTop);
|
|
345
344
|
}
|
|
346
345
|
const elementRect = element.getBoundingClientRect();
|
|
347
346
|
const parentRect = parentElement.getBoundingClientRect();
|
|
348
|
-
return
|
|
347
|
+
return elementRect.top < parentRect.top + parentRect.height;
|
|
349
348
|
}
|
|
350
349
|
}
|
|
351
|
-
SkyInfiniteScrollDomAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
352
|
-
SkyInfiniteScrollDomAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.
|
|
353
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
350
|
+
SkyInfiniteScrollDomAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyInfiniteScrollDomAdapterService, deps: [{ token: i1$1.SkyAppWindowRef }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
351
|
+
SkyInfiniteScrollDomAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyInfiniteScrollDomAdapterService });
|
|
352
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyInfiniteScrollDomAdapterService, decorators: [{
|
|
354
353
|
type: Injectable
|
|
355
354
|
}], ctorParameters: function () { return [{ type: i1$1.SkyAppWindowRef }]; } });
|
|
356
355
|
|
|
@@ -417,7 +416,8 @@ class SkyInfiniteScrollComponent {
|
|
|
417
416
|
setListeners() {
|
|
418
417
|
if (this.enabled) {
|
|
419
418
|
// The user has scrolled to the infinite scroll element.
|
|
420
|
-
this.domAdapter
|
|
419
|
+
this.domAdapter
|
|
420
|
+
.scrollTo(this.elementRef)
|
|
421
421
|
.pipe(takeUntil(this.ngUnsubscribe))
|
|
422
422
|
.subscribe(() => {
|
|
423
423
|
if (!this.isWaiting && this.enabled) {
|
|
@@ -425,7 +425,8 @@ class SkyInfiniteScrollComponent {
|
|
|
425
425
|
}
|
|
426
426
|
});
|
|
427
427
|
// New items have been loaded into the parent element.
|
|
428
|
-
this.domAdapter
|
|
428
|
+
this.domAdapter
|
|
429
|
+
.parentChanges(this.elementRef)
|
|
429
430
|
.pipe(takeUntil(this.ngUnsubscribe))
|
|
430
431
|
.subscribe(() => {
|
|
431
432
|
if (!this.loading) {
|
|
@@ -439,20 +440,16 @@ class SkyInfiniteScrollComponent {
|
|
|
439
440
|
}
|
|
440
441
|
}
|
|
441
442
|
}
|
|
442
|
-
SkyInfiniteScrollComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
443
|
-
SkyInfiniteScrollComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
444
|
-
|
|
445
|
-
], ngImport: i0, template: "<div *ngIf=\"enabled\"\n class=\"sky-infinite-scroll\"\n>\n <button *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\n [isWaiting]=\"isWaiting\"\n >\n </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 });
|
|
446
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SkyInfiniteScrollComponent, decorators: [{
|
|
443
|
+
SkyInfiniteScrollComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyInfiniteScrollComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: SkyInfiniteScrollDomAdapterService }], target: i0.ɵɵFactoryTarget.Component });
|
|
444
|
+
SkyInfiniteScrollComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", 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 });
|
|
445
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyInfiniteScrollComponent, decorators: [{
|
|
447
446
|
type: Component,
|
|
448
447
|
args: [{
|
|
449
448
|
selector: 'sky-infinite-scroll',
|
|
450
449
|
templateUrl: './infinite-scroll.component.html',
|
|
451
450
|
styleUrls: ['./infinite-scroll.component.scss'],
|
|
452
451
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
453
|
-
providers: [
|
|
454
|
-
SkyInfiniteScrollDomAdapterService
|
|
455
|
-
]
|
|
452
|
+
providers: [SkyInfiniteScrollDomAdapterService],
|
|
456
453
|
}]
|
|
457
454
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: SkyInfiniteScrollDomAdapterService }]; }, propDecorators: { enabled: [{
|
|
458
455
|
type: Input
|
|
@@ -464,29 +461,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
464
461
|
|
|
465
462
|
class SkyInfiniteScrollModule {
|
|
466
463
|
}
|
|
467
|
-
SkyInfiniteScrollModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
468
|
-
SkyInfiniteScrollModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
SkyInfiniteScrollModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SkyInfiniteScrollModule, imports: [[
|
|
472
|
-
CommonModule,
|
|
473
|
-
SkyListsResourcesModule,
|
|
474
|
-
SkyWaitModule
|
|
475
|
-
]] });
|
|
476
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SkyInfiniteScrollModule, decorators: [{
|
|
464
|
+
SkyInfiniteScrollModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyInfiniteScrollModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
465
|
+
SkyInfiniteScrollModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyInfiniteScrollModule, declarations: [SkyInfiniteScrollComponent], imports: [CommonModule, SkyListsResourcesModule, SkyWaitModule], exports: [SkyInfiniteScrollComponent] });
|
|
466
|
+
SkyInfiniteScrollModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyInfiniteScrollModule, imports: [[CommonModule, SkyListsResourcesModule, SkyWaitModule]] });
|
|
467
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyInfiniteScrollModule, decorators: [{
|
|
477
468
|
type: NgModule,
|
|
478
469
|
args: [{
|
|
479
|
-
declarations: [
|
|
480
|
-
|
|
481
|
-
],
|
|
482
|
-
imports: [
|
|
483
|
-
CommonModule,
|
|
484
|
-
SkyListsResourcesModule,
|
|
485
|
-
SkyWaitModule
|
|
486
|
-
],
|
|
487
|
-
exports: [
|
|
488
|
-
SkyInfiniteScrollComponent
|
|
489
|
-
]
|
|
470
|
+
declarations: [SkyInfiniteScrollComponent],
|
|
471
|
+
imports: [CommonModule, SkyListsResourcesModule, SkyWaitModule],
|
|
472
|
+
exports: [SkyInfiniteScrollComponent],
|
|
490
473
|
}]
|
|
491
474
|
}] });
|
|
492
475
|
|
|
@@ -542,10 +525,10 @@ class SkyPagingComponent {
|
|
|
542
525
|
this.setPage(this.currentPage - 1);
|
|
543
526
|
}
|
|
544
527
|
get isPreviousButtonDisabled() {
|
|
545
|
-
return
|
|
528
|
+
return this.currentPage === 1;
|
|
546
529
|
}
|
|
547
530
|
get isNextButtonDisabled() {
|
|
548
|
-
return
|
|
531
|
+
return this.currentPage === this.pageCount;
|
|
549
532
|
}
|
|
550
533
|
getDisplayedPageNumbers(pageCount, maxDisplayedPages, pageNumber) {
|
|
551
534
|
let pageIndex = pageNumber - 1;
|
|
@@ -584,19 +567,18 @@ class SkyPagingComponent {
|
|
|
584
567
|
this.pageCount = Math.ceil(this.itemCount / this.pageSize);
|
|
585
568
|
}
|
|
586
569
|
setDisplayedPages() {
|
|
587
|
-
this.displayedPages =
|
|
588
|
-
this.getDisplayedPageNumbers(this.pageCount, this.maxPages, this.currentPage);
|
|
570
|
+
this.displayedPages = this.getDisplayedPageNumbers(this.pageCount, this.maxPages, this.currentPage);
|
|
589
571
|
}
|
|
590
572
|
}
|
|
591
|
-
SkyPagingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
592
|
-
SkyPagingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
593
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
573
|
+
SkyPagingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyPagingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
574
|
+
SkyPagingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", 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=\"\n sky-btn sky-btn-default sky-paging-btn sky-paging-btn-previous sky-box\n \"\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 [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=\"\n sky-btn sky-btn-default sky-paging-btn sky-paging-btn-next sky-box\n \"\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 });
|
|
575
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyPagingComponent, decorators: [{
|
|
594
576
|
type: Component,
|
|
595
577
|
args: [{
|
|
596
578
|
selector: 'sky-paging',
|
|
597
579
|
templateUrl: './paging.component.html',
|
|
598
580
|
styleUrls: ['./paging.component.scss'],
|
|
599
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
581
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
600
582
|
}]
|
|
601
583
|
}], propDecorators: { currentPage: [{
|
|
602
584
|
type: Input
|
|
@@ -614,32 +596,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
614
596
|
|
|
615
597
|
class SkyPagingModule {
|
|
616
598
|
}
|
|
617
|
-
SkyPagingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
618
|
-
SkyPagingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.
|
|
599
|
+
SkyPagingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyPagingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
600
|
+
SkyPagingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyPagingModule, declarations: [SkyPagingComponent], imports: [CommonModule,
|
|
619
601
|
SkyIconModule,
|
|
620
602
|
SkyListsResourcesModule,
|
|
621
603
|
SkyThemeModule], exports: [SkyPagingComponent] });
|
|
622
|
-
SkyPagingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.
|
|
604
|
+
SkyPagingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyPagingModule, imports: [[
|
|
623
605
|
CommonModule,
|
|
624
606
|
SkyIconModule,
|
|
625
607
|
SkyListsResourcesModule,
|
|
626
|
-
SkyThemeModule
|
|
608
|
+
SkyThemeModule,
|
|
627
609
|
]] });
|
|
628
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
610
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyPagingModule, decorators: [{
|
|
629
611
|
type: NgModule,
|
|
630
612
|
args: [{
|
|
631
|
-
declarations: [
|
|
632
|
-
SkyPagingComponent
|
|
633
|
-
],
|
|
613
|
+
declarations: [SkyPagingComponent],
|
|
634
614
|
imports: [
|
|
635
615
|
CommonModule,
|
|
636
616
|
SkyIconModule,
|
|
637
617
|
SkyListsResourcesModule,
|
|
638
|
-
SkyThemeModule
|
|
618
|
+
SkyThemeModule,
|
|
639
619
|
],
|
|
640
|
-
exports: [
|
|
641
|
-
SkyPagingComponent
|
|
642
|
-
]
|
|
620
|
+
exports: [SkyPagingComponent],
|
|
643
621
|
}]
|
|
644
622
|
}] });
|
|
645
623
|
|
|
@@ -648,13 +626,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
648
626
|
*/
|
|
649
627
|
class SkyRepeaterItemContentComponent {
|
|
650
628
|
}
|
|
651
|
-
SkyRepeaterItemContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
652
|
-
SkyRepeaterItemContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
653
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
629
|
+
SkyRepeaterItemContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterItemContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
630
|
+
SkyRepeaterItemContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", type: SkyRepeaterItemContentComponent, selector: "sky-repeater-item-content", ngImport: i0, template: "<ng-content></ng-content>\n" });
|
|
631
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterItemContentComponent, decorators: [{
|
|
654
632
|
type: Component,
|
|
655
633
|
args: [{
|
|
656
634
|
selector: 'sky-repeater-item-content',
|
|
657
|
-
templateUrl: './repeater-item-content.component.html'
|
|
635
|
+
templateUrl: './repeater-item-content.component.html',
|
|
658
636
|
}]
|
|
659
637
|
}] });
|
|
660
638
|
|
|
@@ -666,13 +644,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
666
644
|
/* Code coverage having problems with no statements in classes */
|
|
667
645
|
class SkyRepeaterItemContextMenuComponent {
|
|
668
646
|
}
|
|
669
|
-
SkyRepeaterItemContextMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
670
|
-
SkyRepeaterItemContextMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
671
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
647
|
+
SkyRepeaterItemContextMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterItemContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
648
|
+
SkyRepeaterItemContextMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", type: SkyRepeaterItemContextMenuComponent, selector: "sky-repeater-item-context-menu", ngImport: i0, template: "<ng-content></ng-content>\n" });
|
|
649
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterItemContextMenuComponent, decorators: [{
|
|
672
650
|
type: Component,
|
|
673
651
|
args: [{
|
|
674
652
|
selector: 'sky-repeater-item-context-menu',
|
|
675
|
-
templateUrl: './repeater-item-context-menu.component.html'
|
|
653
|
+
templateUrl: './repeater-item-context-menu.component.html',
|
|
676
654
|
}]
|
|
677
655
|
}] });
|
|
678
656
|
|
|
@@ -697,7 +675,7 @@ class SkyRepeaterService {
|
|
|
697
675
|
if (this.enableActiveState) {
|
|
698
676
|
/* istanbul ignore else */
|
|
699
677
|
if (item) {
|
|
700
|
-
const index = this.items.findIndex(i => i === item);
|
|
678
|
+
const index = this.items.findIndex((i) => i === item);
|
|
701
679
|
this.activeItemIndexChange.next(index);
|
|
702
680
|
this.activeItemChange.next(item);
|
|
703
681
|
}
|
|
@@ -739,9 +717,9 @@ class SkyRepeaterService {
|
|
|
739
717
|
this.items.splice(newIndex, 0, this.items.splice(oldIndex, 1)[0]);
|
|
740
718
|
}
|
|
741
719
|
}
|
|
742
|
-
SkyRepeaterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
743
|
-
SkyRepeaterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.
|
|
744
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
720
|
+
SkyRepeaterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
721
|
+
SkyRepeaterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterService });
|
|
722
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterService, decorators: [{
|
|
745
723
|
type: Injectable
|
|
746
724
|
}] });
|
|
747
725
|
|
|
@@ -804,9 +782,9 @@ class SkyRepeaterAdapterService {
|
|
|
804
782
|
return Array.from(this.host.nativeElement.querySelectorAll(this.repeaterItemGroupSelector));
|
|
805
783
|
}
|
|
806
784
|
}
|
|
807
|
-
SkyRepeaterAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
808
|
-
SkyRepeaterAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.
|
|
809
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
785
|
+
SkyRepeaterAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterAdapterService, deps: [{ token: SkyRepeaterService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
786
|
+
SkyRepeaterAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterAdapterService });
|
|
787
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterAdapterService, decorators: [{
|
|
810
788
|
type: Injectable
|
|
811
789
|
}], ctorParameters: function () { return [{ type: SkyRepeaterService }]; } });
|
|
812
790
|
|
|
@@ -861,9 +839,13 @@ class SkyRepeaterItemComponent {
|
|
|
861
839
|
this._isExpanded = true;
|
|
862
840
|
this._isSelected = false;
|
|
863
841
|
this.slideForExpanded(false);
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
.
|
|
842
|
+
forkJoin([
|
|
843
|
+
this.resourceService.getString('skyux_repeater_item_reorder_cancel'),
|
|
844
|
+
this.resourceService.getString('skyux_repeater_item_reorder_finish'),
|
|
845
|
+
this.resourceService.getString('skyux_repeater_item_reorder_instructions'),
|
|
846
|
+
this.resourceService.getString('skyux_repeater_item_reorder_operation'),
|
|
847
|
+
this.resourceService.getString('skyux_repeater_item_reorder_moved'),
|
|
848
|
+
]).subscribe((translatedStrings) => {
|
|
867
849
|
this.reorderCancelText = translatedStrings[0];
|
|
868
850
|
this.reorderFinishText = translatedStrings[1];
|
|
869
851
|
this.reorderStateDescription = translatedStrings[2];
|
|
@@ -1000,7 +982,8 @@ class SkyRepeaterItemComponent {
|
|
|
1000
982
|
if (this.keyboardReorderingEnabled) {
|
|
1001
983
|
this.keyboardReorderingEnabled = false;
|
|
1002
984
|
this.revertReorderSteps();
|
|
1003
|
-
this.reorderButtonLabel =
|
|
985
|
+
this.reorderButtonLabel =
|
|
986
|
+
this.reorderCancelText + ' ' + this.reorderInstructions;
|
|
1004
987
|
this.adapterService.focusElement(event.target);
|
|
1005
988
|
event.preventDefault();
|
|
1006
989
|
event.stopPropagation();
|
|
@@ -1090,8 +1073,7 @@ class SkyRepeaterItemComponent {
|
|
|
1090
1073
|
this.reorderState = this.reorderStateDescription;
|
|
1091
1074
|
}
|
|
1092
1075
|
else {
|
|
1093
|
-
this.reorderState =
|
|
1094
|
-
`${this.reorderFinishText} ${this.reorderCurrentIndex + 1} ${this.reorderInstructions}`;
|
|
1076
|
+
this.reorderState = `${this.reorderFinishText} ${this.reorderCurrentIndex + 1} ${this.reorderInstructions}`;
|
|
1095
1077
|
}
|
|
1096
1078
|
}
|
|
1097
1079
|
revertReorderSteps() {
|
|
@@ -1109,7 +1091,8 @@ class SkyRepeaterItemComponent {
|
|
|
1109
1091
|
.subscribe(() => {
|
|
1110
1092
|
this.hasItemContent = this.repeaterItemContentComponents.length > 0;
|
|
1111
1093
|
/* istanbul ignore next */
|
|
1112
|
-
this.isCollapsible =
|
|
1094
|
+
this.isCollapsible =
|
|
1095
|
+
this.hasItemContent && this.repeaterService.expandMode !== 'none';
|
|
1113
1096
|
/* istanbul ignore else */
|
|
1114
1097
|
if (this.repeaterService.expandMode === 'single') {
|
|
1115
1098
|
this.repeaterService.onItemCollapseStateChange(this);
|
|
@@ -1117,18 +1100,20 @@ class SkyRepeaterItemComponent {
|
|
|
1117
1100
|
});
|
|
1118
1101
|
}
|
|
1119
1102
|
}
|
|
1120
|
-
SkyRepeaterItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
1121
|
-
SkyRepeaterItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.10", type: SkyRepeaterItemComponent, selector: "sky-repeater-item", inputs: { 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 tabindex=\"0\"\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\n select=\"sky-inline-delete\"\n ></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\n #skyRepeaterItemLeft\n>\n <div\n class=\"sky-repeater-item-left\"\n >\n <ng-container *ngIf=\"reorderable\">\n <span\n aria-live=\"assertive\"\n class=\"sky-repeater-item-reorder-assistive-text\"\n [id]=\"contentId + '-reorder-state'\"\n >\n {{reorderState}}\n </span>\n <button\n class=\"sky-btn sky-tile-tools-control sky-repeater-item-grab-handle\"\n type=\"button\"\n [attr.aria-label]=\"reorderButtonLabel\"\n (blur)=\"onReorderHandleBlur($event)\"\n (keydown)=\"onReorderHandleKeyDown($event)\"\n #grabHandle\n >\n <sky-icon\n icon=\"arrows-v\"\n ></sky-icon>\n </button>\n </ng-container>\n <sky-checkbox\n *ngIf=\"selectable\"\n class=\"sky-repeater-item-checkbox\"\n [checked]=\"isSelected\"\n [label]=\"'skyux_repeater_item_checkbox_label' | skyLibResources\"\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\n select=\"sky-repeater-item-context-menu\"\n ></ng-content>\n </div>\n </div>\n</ng-template>\n\n<ng-template\n #skyRepeaterItemRight\n>\n <div\n class=\"sky-repeater-item-right\"\n #itemHeaderRef\n >\n <div\n class=\"sky-repeater-item-header\"\n [hidden]=\"titleRef.children.length === 0\"\n (click)=\"headerClick()\"\n >\n <div\n class=\"sky-repeater-item-title sky-emphasized\"\n #titleRef\n >\n <ng-content\n select=\"sky-repeater-item-title\"\n ></ng-content>\n </div>\n <button *ngIf=\"reorderable\"\n class=\"sky-btn sky-btn-link sky-repeater-item-reorder-top\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_repeater_item_reorder_top_label' | skyLibResources\"\n (click)=\"moveToTop($event)\"\n >\n <sky-icon\n icon=\"arrow-circle-up\"\n ></sky-icon>\n {{ 'skyux_repeater_item_reorder_top' | skyLibResources }}\n </button>\n <div *ngIf=\"isCollapsible\"\n class=\"sky-repeater-item-chevron\"\n >\n <sky-chevron\n [attr.aria-controls]=\"contentId\"\n [attr.aria-expanded]=\"isExpanded\"\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 *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 *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\n select=\"sky-repeater-item-content\"\n ></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}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-reorder-assistive-text{width:0;height:0;padding:0;opacity:0;position:absolute;margin:-1px;border:0;overflow:hidden;clip:rect(0,0,0,0);outline:none;white-space:nowrap}sky-repeater-item .sky-repeater-item-grab-handle{color:#cdcfd2;cursor:pointer;border:0;width:24px;height:24px;cursor:grab;cursor:-webkit-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:1;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: ["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 });
|
|
1122
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
1103
|
+
SkyRepeaterItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterItemComponent, deps: [{ token: SkyRepeaterService }, { token: i0.ChangeDetectorRef }, { token: SkyRepeaterAdapterService }, { token: i0.ElementRef }, { token: i4.SkyLibResourcesService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1104
|
+
SkyRepeaterItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", 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 });
|
|
1105
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterItemComponent, decorators: [{
|
|
1123
1106
|
type: Component,
|
|
1124
1107
|
args: [{
|
|
1125
1108
|
selector: 'sky-repeater-item',
|
|
1126
1109
|
styleUrls: ['./repeater-item.component.scss'],
|
|
1127
1110
|
templateUrl: './repeater-item.component.html',
|
|
1128
1111
|
animations: [skyAnimationSlide],
|
|
1129
|
-
encapsulation: ViewEncapsulation.None
|
|
1112
|
+
encapsulation: ViewEncapsulation.None,
|
|
1130
1113
|
}]
|
|
1131
|
-
}], ctorParameters: function () { return [{ type: SkyRepeaterService }, { type: i0.ChangeDetectorRef }, { type: SkyRepeaterAdapterService }, { type: i0.ElementRef }, { type: i4.SkyLibResourcesService }]; }, propDecorators: {
|
|
1114
|
+
}], ctorParameters: function () { return [{ type: SkyRepeaterService }, { type: i0.ChangeDetectorRef }, { type: SkyRepeaterAdapterService }, { type: i0.ElementRef }, { type: i4.SkyLibResourcesService }]; }, propDecorators: { itemName: [{
|
|
1115
|
+
type: Input
|
|
1116
|
+
}], inlineFormConfig: [{
|
|
1132
1117
|
type: Input
|
|
1133
1118
|
}], inlineFormTemplate: [{
|
|
1134
1119
|
type: Input
|
|
@@ -1211,7 +1196,9 @@ class SkyRepeaterComponent {
|
|
|
1211
1196
|
.subscribe((item) => {
|
|
1212
1197
|
if (this.expandMode === 'single' && item.isExpanded) {
|
|
1213
1198
|
this.items.forEach((otherItem) => {
|
|
1214
|
-
if (otherItem !== item &&
|
|
1199
|
+
if (otherItem !== item &&
|
|
1200
|
+
otherItem.isExpanded &&
|
|
1201
|
+
otherItem.isCollapsible) {
|
|
1215
1202
|
otherItem.isExpanded = false;
|
|
1216
1203
|
}
|
|
1217
1204
|
});
|
|
@@ -1274,9 +1261,7 @@ class SkyRepeaterComponent {
|
|
|
1274
1261
|
});
|
|
1275
1262
|
// HACK: Not updating for expand mode in a timeout causes an error.
|
|
1276
1263
|
// https://github.com/angular/angular/issues/6005
|
|
1277
|
-
this.items.changes
|
|
1278
|
-
.pipe(takeUntil(this.ngUnsubscribe))
|
|
1279
|
-
.subscribe(() => {
|
|
1264
|
+
this.items.changes.pipe(takeUntil(this.ngUnsubscribe)).subscribe(() => {
|
|
1280
1265
|
setTimeout(() => {
|
|
1281
1266
|
if (!!this.items.last) {
|
|
1282
1267
|
this.updateForExpandMode(this.items.last);
|
|
@@ -1289,7 +1274,7 @@ class SkyRepeaterComponent {
|
|
|
1289
1274
|
});
|
|
1290
1275
|
setTimeout(() => {
|
|
1291
1276
|
this.updateForExpandMode();
|
|
1292
|
-
this.items.forEach(item => {
|
|
1277
|
+
this.items.forEach((item) => {
|
|
1293
1278
|
item.reorderable = this.reorderable;
|
|
1294
1279
|
});
|
|
1295
1280
|
}, 0);
|
|
@@ -1297,13 +1282,14 @@ class SkyRepeaterComponent {
|
|
|
1297
1282
|
ngOnChanges(changes) {
|
|
1298
1283
|
if (changes['activeIndex']) {
|
|
1299
1284
|
this.repeaterService.enableActiveState = true;
|
|
1300
|
-
if (changes['activeIndex'].currentValue !==
|
|
1285
|
+
if (changes['activeIndex'].currentValue !==
|
|
1286
|
+
changes['activeIndex'].previousValue) {
|
|
1301
1287
|
this.repeaterService.activateItemByIndex(this.activeIndex);
|
|
1302
1288
|
}
|
|
1303
1289
|
}
|
|
1304
1290
|
if (changes.reorderable) {
|
|
1305
1291
|
if (this.items) {
|
|
1306
|
-
this.items.forEach(item => item.reorderable = this.reorderable);
|
|
1292
|
+
this.items.forEach((item) => (item.reorderable = this.reorderable));
|
|
1307
1293
|
}
|
|
1308
1294
|
this.changeDetector.markForCheck();
|
|
1309
1295
|
}
|
|
@@ -1340,8 +1326,8 @@ class SkyRepeaterComponent {
|
|
|
1340
1326
|
this.dragulaService.setOptions(this.dragulaGroupName, {
|
|
1341
1327
|
moves: (el, container, handle) => {
|
|
1342
1328
|
const target = el.querySelector('.sky-repeater-item-grab-handle');
|
|
1343
|
-
return
|
|
1344
|
-
}
|
|
1329
|
+
return this.reorderable && target && target.contains(handle);
|
|
1330
|
+
},
|
|
1345
1331
|
});
|
|
1346
1332
|
}
|
|
1347
1333
|
let draggedItemIndex;
|
|
@@ -1382,7 +1368,7 @@ class SkyRepeaterComponent {
|
|
|
1382
1368
|
}
|
|
1383
1369
|
}
|
|
1384
1370
|
emitTags() {
|
|
1385
|
-
const tags = this.repeaterService.items.map(item => item.tag);
|
|
1371
|
+
const tags = this.repeaterService.items.map((item) => item.tag);
|
|
1386
1372
|
this.orderChange.emit(tags);
|
|
1387
1373
|
}
|
|
1388
1374
|
everyItemHasTag() {
|
|
@@ -1391,21 +1377,21 @@ class SkyRepeaterComponent {
|
|
|
1391
1377
|
if (!this.items || this.items.length === 0) {
|
|
1392
1378
|
return false;
|
|
1393
1379
|
}
|
|
1394
|
-
return this.items.toArray().every(item => {
|
|
1380
|
+
return this.items.toArray().every((item) => {
|
|
1395
1381
|
return item.tag !== undefined;
|
|
1396
1382
|
});
|
|
1397
1383
|
}
|
|
1398
1384
|
}
|
|
1399
|
-
SkyRepeaterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
1400
|
-
SkyRepeaterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
1401
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
1385
|
+
SkyRepeaterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", 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 });
|
|
1386
|
+
SkyRepeaterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", 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", "dragulaOptions"] }], pipes: { "skyLibResources": i4.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1387
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterComponent, decorators: [{
|
|
1402
1388
|
type: Component,
|
|
1403
1389
|
args: [{
|
|
1404
1390
|
selector: 'sky-repeater',
|
|
1405
1391
|
styleUrls: ['./repeater.component.scss'],
|
|
1406
1392
|
templateUrl: './repeater.component.html',
|
|
1407
1393
|
providers: [SkyRepeaterService, SkyRepeaterAdapterService],
|
|
1408
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
1394
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1409
1395
|
}]
|
|
1410
1396
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: SkyRepeaterService }, { type: SkyRepeaterAdapterService }, { type: i3$1.DragulaService }, { type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { activeIndex: [{
|
|
1411
1397
|
type: Input
|
|
@@ -1429,20 +1415,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
1429
1415
|
*/
|
|
1430
1416
|
class SkyRepeaterItemTitleComponent {
|
|
1431
1417
|
}
|
|
1432
|
-
SkyRepeaterItemTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
1433
|
-
SkyRepeaterItemTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
1434
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
1418
|
+
SkyRepeaterItemTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterItemTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1419
|
+
SkyRepeaterItemTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", type: SkyRepeaterItemTitleComponent, selector: "sky-repeater-item-title", ngImport: i0, template: "<ng-content></ng-content>\n" });
|
|
1420
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterItemTitleComponent, decorators: [{
|
|
1435
1421
|
type: Component,
|
|
1436
1422
|
args: [{
|
|
1437
1423
|
selector: 'sky-repeater-item-title',
|
|
1438
|
-
templateUrl: './repeater-item-title.component.html'
|
|
1424
|
+
templateUrl: './repeater-item-title.component.html',
|
|
1439
1425
|
}]
|
|
1440
1426
|
}] });
|
|
1441
1427
|
|
|
1442
1428
|
class SkyRepeaterModule {
|
|
1443
1429
|
}
|
|
1444
|
-
SkyRepeaterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
1445
|
-
SkyRepeaterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.
|
|
1430
|
+
SkyRepeaterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1431
|
+
SkyRepeaterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterModule, declarations: [SkyRepeaterComponent,
|
|
1446
1432
|
SkyRepeaterItemComponent,
|
|
1447
1433
|
SkyRepeaterItemContentComponent,
|
|
1448
1434
|
SkyRepeaterItemContextMenuComponent,
|
|
@@ -1457,16 +1443,16 @@ SkyRepeaterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versi
|
|
|
1457
1443
|
SkyRepeaterItemContentComponent,
|
|
1458
1444
|
SkyRepeaterItemContextMenuComponent,
|
|
1459
1445
|
SkyRepeaterItemTitleComponent] });
|
|
1460
|
-
SkyRepeaterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.
|
|
1446
|
+
SkyRepeaterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterModule, imports: [[
|
|
1461
1447
|
CommonModule,
|
|
1462
1448
|
DragulaModule,
|
|
1463
1449
|
SkyChevronModule,
|
|
1464
1450
|
SkyCheckboxModule,
|
|
1465
1451
|
SkyIconModule,
|
|
1466
1452
|
SkyInlineFormModule,
|
|
1467
|
-
SkyListsResourcesModule
|
|
1453
|
+
SkyListsResourcesModule,
|
|
1468
1454
|
]] });
|
|
1469
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
1455
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkyRepeaterModule, decorators: [{
|
|
1470
1456
|
type: NgModule,
|
|
1471
1457
|
args: [{
|
|
1472
1458
|
declarations: [
|
|
@@ -1474,7 +1460,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
1474
1460
|
SkyRepeaterItemComponent,
|
|
1475
1461
|
SkyRepeaterItemContentComponent,
|
|
1476
1462
|
SkyRepeaterItemContextMenuComponent,
|
|
1477
|
-
SkyRepeaterItemTitleComponent
|
|
1463
|
+
SkyRepeaterItemTitleComponent,
|
|
1478
1464
|
],
|
|
1479
1465
|
imports: [
|
|
1480
1466
|
CommonModule,
|
|
@@ -1483,15 +1469,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
1483
1469
|
SkyCheckboxModule,
|
|
1484
1470
|
SkyIconModule,
|
|
1485
1471
|
SkyInlineFormModule,
|
|
1486
|
-
SkyListsResourcesModule
|
|
1472
|
+
SkyListsResourcesModule,
|
|
1487
1473
|
],
|
|
1488
1474
|
exports: [
|
|
1489
1475
|
SkyRepeaterComponent,
|
|
1490
1476
|
SkyRepeaterItemComponent,
|
|
1491
1477
|
SkyRepeaterItemContentComponent,
|
|
1492
1478
|
SkyRepeaterItemContextMenuComponent,
|
|
1493
|
-
SkyRepeaterItemTitleComponent
|
|
1494
|
-
]
|
|
1479
|
+
SkyRepeaterItemTitleComponent,
|
|
1480
|
+
],
|
|
1495
1481
|
}]
|
|
1496
1482
|
}] });
|
|
1497
1483
|
|
|
@@ -1506,9 +1492,9 @@ class SkySortService {
|
|
|
1506
1492
|
this.selectedItem.next(sortItem);
|
|
1507
1493
|
}
|
|
1508
1494
|
}
|
|
1509
|
-
SkySortService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
1510
|
-
SkySortService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.
|
|
1511
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
1495
|
+
SkySortService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1496
|
+
SkySortService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortService });
|
|
1497
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortService, decorators: [{
|
|
1512
1498
|
type: Injectable
|
|
1513
1499
|
}] });
|
|
1514
1500
|
|
|
@@ -1536,9 +1522,10 @@ class SkySortItemComponent {
|
|
|
1536
1522
|
}
|
|
1537
1523
|
}
|
|
1538
1524
|
ngOnChanges(changes) {
|
|
1539
|
-
if (changes &&
|
|
1540
|
-
|
|
1541
|
-
|
|
1525
|
+
if (changes &&
|
|
1526
|
+
changes['active'] &&
|
|
1527
|
+
changes['active'].currentValue &&
|
|
1528
|
+
changes['active'].currentValue !== changes['active'].previousValue) {
|
|
1542
1529
|
this.sortService.selectItem(this.sortItemId);
|
|
1543
1530
|
}
|
|
1544
1531
|
}
|
|
@@ -1554,15 +1541,15 @@ class SkySortItemComponent {
|
|
|
1554
1541
|
}
|
|
1555
1542
|
}
|
|
1556
1543
|
}
|
|
1557
|
-
SkySortItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
1558
|
-
SkySortItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
1559
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
1544
|
+
SkySortItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortItemComponent, deps: [{ token: SkySortService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1545
|
+
SkySortItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", 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:13px;padding-left:calc(20px - 3px);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:13px;padding-left:calc(20px - 3px);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 });
|
|
1546
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortItemComponent, decorators: [{
|
|
1560
1547
|
type: Component,
|
|
1561
1548
|
args: [{
|
|
1562
1549
|
selector: 'sky-sort-item',
|
|
1563
1550
|
styleUrls: ['./sort-item.component.scss'],
|
|
1564
1551
|
templateUrl: './sort-item.component.html',
|
|
1565
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
1552
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1566
1553
|
}]
|
|
1567
1554
|
}], ctorParameters: function () { return [{ type: SkySortService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { active: [{
|
|
1568
1555
|
type: Input
|
|
@@ -1572,14 +1559,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
1572
1559
|
|
|
1573
1560
|
class SkySortMenuHeadingComponent {
|
|
1574
1561
|
}
|
|
1575
|
-
SkySortMenuHeadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
1576
|
-
SkySortMenuHeadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
1577
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
1562
|
+
SkySortMenuHeadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortMenuHeadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1563
|
+
SkySortMenuHeadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", 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 } });
|
|
1564
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortMenuHeadingComponent, decorators: [{
|
|
1578
1565
|
type: Component,
|
|
1579
1566
|
args: [{
|
|
1580
1567
|
selector: 'sky-sort-menu-heading',
|
|
1581
1568
|
templateUrl: './sort-menu-heading.component.html',
|
|
1582
|
-
styleUrls: ['./sort-menu-heading.component.scss']
|
|
1569
|
+
styleUrls: ['./sort-menu-heading.component.scss'],
|
|
1583
1570
|
}]
|
|
1584
1571
|
}] });
|
|
1585
1572
|
|
|
@@ -1593,24 +1580,20 @@ class SkySortComponent {
|
|
|
1593
1580
|
}
|
|
1594
1581
|
dropdownClicked() {
|
|
1595
1582
|
this.dropdownController.next({
|
|
1596
|
-
type: SkyDropdownMessageType.Close
|
|
1583
|
+
type: SkyDropdownMessageType.Close,
|
|
1597
1584
|
});
|
|
1598
1585
|
}
|
|
1599
1586
|
}
|
|
1600
|
-
SkySortComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
1601
|
-
SkySortComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.
|
|
1602
|
-
|
|
1603
|
-
], 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 <sky-dropdown-button>\n <sky-icon *skyThemeIf=\"'default'\"\n icon=\"sort\"\n ></sky-icon>\n <sky-icon *skyThemeIf=\"'modern'\"\n icon=\"sort\"\n iconType=\"skyux\"\n ></sky-icon>\n <span\n *ngIf=\"showButtonText\"\n 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\">\n </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 });
|
|
1604
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SkySortComponent, decorators: [{
|
|
1587
|
+
SkySortComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1588
|
+
SkySortComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", 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 });
|
|
1589
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortComponent, decorators: [{
|
|
1605
1590
|
type: Component,
|
|
1606
1591
|
args: [{
|
|
1607
1592
|
selector: 'sky-sort',
|
|
1608
1593
|
styleUrls: ['./sort.component.scss'],
|
|
1609
1594
|
templateUrl: './sort.component.html',
|
|
1610
|
-
providers: [
|
|
1611
|
-
|
|
1612
|
-
],
|
|
1613
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
1595
|
+
providers: [SkySortService],
|
|
1596
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1614
1597
|
}]
|
|
1615
1598
|
}], propDecorators: { showButtonText: [{
|
|
1616
1599
|
type: Input
|
|
@@ -1618,31 +1601,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
1618
1601
|
|
|
1619
1602
|
class SkySortModule {
|
|
1620
1603
|
}
|
|
1621
|
-
SkySortModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.
|
|
1622
|
-
SkySortModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.
|
|
1604
|
+
SkySortModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1605
|
+
SkySortModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortModule, declarations: [SkySortComponent,
|
|
1623
1606
|
SkySortItemComponent,
|
|
1624
1607
|
SkySortMenuHeadingComponent], imports: [CommonModule,
|
|
1625
1608
|
SkyDropdownModule,
|
|
1626
1609
|
SkyIconModule,
|
|
1627
1610
|
SkyIdModule,
|
|
1628
1611
|
SkyListsResourcesModule,
|
|
1629
|
-
SkyThemeModule], exports: [SkySortComponent,
|
|
1630
|
-
|
|
1631
|
-
SkySortModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.10", ngImport: i0, type: SkySortModule, imports: [[
|
|
1612
|
+
SkyThemeModule], exports: [SkySortComponent, SkySortItemComponent] });
|
|
1613
|
+
SkySortModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortModule, imports: [[
|
|
1632
1614
|
CommonModule,
|
|
1633
1615
|
SkyDropdownModule,
|
|
1634
1616
|
SkyIconModule,
|
|
1635
1617
|
SkyIdModule,
|
|
1636
1618
|
SkyListsResourcesModule,
|
|
1637
|
-
SkyThemeModule
|
|
1619
|
+
SkyThemeModule,
|
|
1638
1620
|
]] });
|
|
1639
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.
|
|
1621
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: SkySortModule, decorators: [{
|
|
1640
1622
|
type: NgModule,
|
|
1641
1623
|
args: [{
|
|
1642
1624
|
declarations: [
|
|
1643
1625
|
SkySortComponent,
|
|
1644
1626
|
SkySortItemComponent,
|
|
1645
|
-
SkySortMenuHeadingComponent
|
|
1627
|
+
SkySortMenuHeadingComponent,
|
|
1646
1628
|
],
|
|
1647
1629
|
imports: [
|
|
1648
1630
|
CommonModule,
|
|
@@ -1650,12 +1632,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.10", ngImpo
|
|
|
1650
1632
|
SkyIconModule,
|
|
1651
1633
|
SkyIdModule,
|
|
1652
1634
|
SkyListsResourcesModule,
|
|
1653
|
-
SkyThemeModule
|
|
1635
|
+
SkyThemeModule,
|
|
1654
1636
|
],
|
|
1655
|
-
exports: [
|
|
1656
|
-
SkySortComponent,
|
|
1657
|
-
SkySortItemComponent
|
|
1658
|
-
]
|
|
1637
|
+
exports: [SkySortComponent, SkySortItemComponent],
|
|
1659
1638
|
}]
|
|
1660
1639
|
}] });
|
|
1661
1640
|
|