@skyux/action-bars 7.0.0-beta.8 → 7.0.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/documentation.json +241 -111
- package/esm2020/lib/modules/shared/sky-action-bars-resources.module.mjs +5 -5
- package/esm2020/lib/modules/summary-action-bar/actions/summary-action-bar-actions.component.mjs +4 -4
- package/esm2020/lib/modules/summary-action-bar/actions/summary-action-bar-cancel.component.mjs +4 -4
- package/esm2020/lib/modules/summary-action-bar/actions/summary-action-bar-primary-action.component.mjs +4 -4
- package/esm2020/lib/modules/summary-action-bar/actions/summary-action-bar-secondary-action.component.mjs +14 -9
- package/esm2020/lib/modules/summary-action-bar/actions/summary-action-bar-secondary-actions.component.mjs +45 -38
- package/esm2020/lib/modules/summary-action-bar/summary/summary-action-bar-summary.component.mjs +4 -4
- package/esm2020/lib/modules/summary-action-bar/summary-action-bar-adapter.service.mjs +26 -23
- package/esm2020/lib/modules/summary-action-bar/summary-action-bar-collapsible.pipe.mjs +19 -0
- package/esm2020/lib/modules/summary-action-bar/summary-action-bar.component.mjs +78 -74
- package/esm2020/lib/modules/summary-action-bar/summary-action-bar.module.mjs +8 -5
- package/esm2020/testing/summary-action-bar/summary-action-bar-fixture-action.mjs +1 -1
- package/esm2020/testing/summary-action-bar/summary-action-bar-fixture.mjs +68 -72
- package/esm2020/testing/summary-action-bar/summary-action-bar.module.mjs +5 -5
- package/fesm2015/skyux-action-bars-testing.mjs +76 -81
- package/fesm2015/skyux-action-bars-testing.mjs.map +1 -1
- package/fesm2015/skyux-action-bars.mjs +192 -155
- package/fesm2015/skyux-action-bars.mjs.map +1 -1
- package/fesm2020/skyux-action-bars-testing.mjs +71 -75
- package/fesm2020/skyux-action-bars-testing.mjs.map +1 -1
- package/fesm2020/skyux-action-bars.mjs +188 -155
- package/fesm2020/skyux-action-bars.mjs.map +1 -1
- package/lib/modules/summary-action-bar/actions/summary-action-bar-secondary-action.component.d.ts +3 -4
- package/lib/modules/summary-action-bar/actions/summary-action-bar-secondary-actions.component.d.ts +2 -7
- package/lib/modules/summary-action-bar/summary-action-bar-adapter.service.d.ts +3 -5
- package/lib/modules/summary-action-bar/summary-action-bar-collapsible.pipe.d.ts +9 -0
- package/lib/modules/summary-action-bar/summary-action-bar.component.d.ts +7 -20
- package/lib/modules/summary-action-bar/summary-action-bar.module.d.ts +13 -12
- package/package.json +12 -12
- package/testing/summary-action-bar/summary-action-bar-fixture-action.d.ts +1 -1
- package/testing/summary-action-bar/summary-action-bar-fixture.d.ts +3 -14
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as i3 from '@angular/common';
|
|
2
2
|
import { CommonModule } from '@angular/common';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { NgModule, Component, ChangeDetectionStrategy, EventEmitter, Input, Output, ContentChildren, Injectable, ElementRef, ContentChild, ViewChild } from '@angular/core';
|
|
4
|
+
import { NgModule, Component, ChangeDetectionStrategy, EventEmitter, Input, Output, ContentChildren, Pipe, Injectable, ElementRef, ContentChild, ViewChild } from '@angular/core';
|
|
5
5
|
import * as i6 from '@skyux/i18n';
|
|
6
6
|
import { getLibStringForLocale, SkyI18nModule, SKY_LIB_RESOURCES_PROVIDERS } from '@skyux/i18n';
|
|
7
7
|
import * as i4 from '@skyux/indicators';
|
|
@@ -10,6 +10,7 @@ import * as i3$1 from '@skyux/popovers';
|
|
|
10
10
|
import { SkyDropdownMessageType, SkyDropdownModule } from '@skyux/popovers';
|
|
11
11
|
import * as i5 from '@skyux/theme';
|
|
12
12
|
import { SkyThemeModule } from '@skyux/theme';
|
|
13
|
+
import { __classPrivateFieldSet, __classPrivateFieldGet } from 'tslib';
|
|
13
14
|
import * as i2 from '@skyux/core';
|
|
14
15
|
import { SkyMediaBreakpoints } from '@skyux/core';
|
|
15
16
|
import { Subject, fromEvent } from 'rxjs';
|
|
@@ -40,16 +41,16 @@ class SkyActionBarsResourcesProvider {
|
|
|
40
41
|
*/
|
|
41
42
|
class SkyActionBarsResourcesModule {
|
|
42
43
|
}
|
|
43
|
-
SkyActionBarsResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.
|
|
44
|
-
SkyActionBarsResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.
|
|
45
|
-
SkyActionBarsResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.
|
|
44
|
+
SkyActionBarsResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkyActionBarsResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
45
|
+
SkyActionBarsResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.11", ngImport: i0, type: SkyActionBarsResourcesModule, exports: [SkyI18nModule] });
|
|
46
|
+
SkyActionBarsResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkyActionBarsResourcesModule, providers: [
|
|
46
47
|
{
|
|
47
48
|
provide: SKY_LIB_RESOURCES_PROVIDERS,
|
|
48
49
|
useClass: SkyActionBarsResourcesProvider,
|
|
49
50
|
multi: true,
|
|
50
51
|
},
|
|
51
52
|
], imports: [SkyI18nModule] });
|
|
52
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.
|
|
53
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkyActionBarsResourcesModule, decorators: [{
|
|
53
54
|
type: NgModule,
|
|
54
55
|
args: [{
|
|
55
56
|
exports: [SkyI18nModule],
|
|
@@ -68,9 +69,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImpor
|
|
|
68
69
|
*/
|
|
69
70
|
class SkySummaryActionBarActionsComponent {
|
|
70
71
|
}
|
|
71
|
-
SkySummaryActionBarActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.
|
|
72
|
-
SkySummaryActionBarActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.
|
|
73
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.
|
|
72
|
+
SkySummaryActionBarActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
73
|
+
SkySummaryActionBarActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.11", type: SkySummaryActionBarActionsComponent, selector: "sky-summary-action-bar-actions", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:inline-flex}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
74
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarActionsComponent, decorators: [{
|
|
74
75
|
type: Component,
|
|
75
76
|
args: [{ selector: 'sky-summary-action-bar-actions', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n", styles: [":host{display:inline-flex}\n"] }]
|
|
76
77
|
}] });
|
|
@@ -93,9 +94,9 @@ class SkySummaryActionBarCancelComponent {
|
|
|
93
94
|
this.actionClick.emit();
|
|
94
95
|
}
|
|
95
96
|
}
|
|
96
|
-
SkySummaryActionBarCancelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.
|
|
97
|
-
SkySummaryActionBarCancelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.
|
|
98
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.
|
|
97
|
+
SkySummaryActionBarCancelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarCancelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
98
|
+
SkySummaryActionBarCancelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.11", type: SkySummaryActionBarCancelComponent, selector: "sky-summary-action-bar-cancel", inputs: { disabled: "disabled" }, outputs: { actionClick: "actionClick" }, ngImport: i0, template: "<button\n type=\"button\"\n class=\"sky-btn sky-btn-link sky-summary-action-bar-cancel\"\n [disabled]=\"disabled\"\n (click)=\"onCancelClicked()\"\n>\n <ng-content></ng-content>\n</button>\n", styles: ["::ng-deep .sky-modal .sky-modal-footer-container button.sky-btn-link:first-child{margin-left:initial}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
99
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarCancelComponent, decorators: [{
|
|
99
100
|
type: Component,
|
|
100
101
|
args: [{ selector: 'sky-summary-action-bar-cancel', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n type=\"button\"\n class=\"sky-btn sky-btn-link sky-summary-action-bar-cancel\"\n [disabled]=\"disabled\"\n (click)=\"onCancelClicked()\"\n>\n <ng-content></ng-content>\n</button>\n", styles: ["::ng-deep .sky-modal .sky-modal-footer-container button.sky-btn-link:first-child{margin-left:initial}\n"] }]
|
|
101
102
|
}], propDecorators: { disabled: [{
|
|
@@ -123,9 +124,9 @@ class SkySummaryActionBarPrimaryActionComponent {
|
|
|
123
124
|
this.actionClick.emit();
|
|
124
125
|
}
|
|
125
126
|
}
|
|
126
|
-
SkySummaryActionBarPrimaryActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.
|
|
127
|
-
SkySummaryActionBarPrimaryActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.
|
|
128
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.
|
|
127
|
+
SkySummaryActionBarPrimaryActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarPrimaryActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
128
|
+
SkySummaryActionBarPrimaryActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.11", type: SkySummaryActionBarPrimaryActionComponent, selector: "sky-summary-action-bar-primary-action", inputs: { disabled: "disabled" }, outputs: { actionClick: "actionClick" }, ngImport: i0, template: "<button\n type=\"button\"\n class=\"sky-btn sky-btn-primary\"\n [disabled]=\"disabled\"\n (click)=\"onButtonClicked()\"\n>\n <ng-content></ng-content>\n</button>\n", styles: [".sky-btn{margin-right:10px}:host-context(.sky-theme-modern) .sky-btn{margin-right:10px}.sky-theme-modern .sky-btn{margin-right:10px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
129
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarPrimaryActionComponent, decorators: [{
|
|
129
130
|
type: Component,
|
|
130
131
|
args: [{ selector: 'sky-summary-action-bar-primary-action', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n type=\"button\"\n class=\"sky-btn sky-btn-primary\"\n [disabled]=\"disabled\"\n (click)=\"onButtonClicked()\"\n>\n <ng-content></ng-content>\n</button>\n", styles: [".sky-btn{margin-right:10px}:host-context(.sky-theme-modern) .sky-btn{margin-right:10px}.sky-theme-modern .sky-btn{margin-right:10px}\n"] }]
|
|
131
132
|
}], propDecorators: { disabled: [{
|
|
@@ -134,12 +135,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImpor
|
|
|
134
135
|
type: Output
|
|
135
136
|
}] } });
|
|
136
137
|
|
|
138
|
+
var _SkySummaryActionBarSecondaryActionComponent__isDropdown, _SkySummaryActionBarSecondaryActionComponent_changeDetector;
|
|
137
139
|
/**
|
|
138
140
|
* Specifies secondary actions.
|
|
139
141
|
*/
|
|
140
142
|
class SkySummaryActionBarSecondaryActionComponent {
|
|
141
143
|
constructor(changeDetector) {
|
|
142
|
-
this.changeDetector = changeDetector;
|
|
143
144
|
/**
|
|
144
145
|
* Indicates whether to disable a secondary action.
|
|
145
146
|
* @default false
|
|
@@ -149,21 +150,25 @@ class SkySummaryActionBarSecondaryActionComponent {
|
|
|
149
150
|
* Fires when users select a secondary action.
|
|
150
151
|
*/
|
|
151
152
|
this.actionClick = new EventEmitter();
|
|
153
|
+
_SkySummaryActionBarSecondaryActionComponent__isDropdown.set(this, void 0);
|
|
154
|
+
_SkySummaryActionBarSecondaryActionComponent_changeDetector.set(this, void 0);
|
|
155
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarSecondaryActionComponent_changeDetector, changeDetector, "f");
|
|
152
156
|
}
|
|
153
157
|
set isDropdown(value) {
|
|
154
|
-
this
|
|
155
|
-
this.
|
|
158
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarSecondaryActionComponent__isDropdown, value, "f");
|
|
159
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarSecondaryActionComponent_changeDetector, "f").detectChanges();
|
|
156
160
|
}
|
|
157
161
|
get isDropdown() {
|
|
158
|
-
return this
|
|
162
|
+
return __classPrivateFieldGet(this, _SkySummaryActionBarSecondaryActionComponent__isDropdown, "f");
|
|
159
163
|
}
|
|
160
164
|
onButtonClicked() {
|
|
161
165
|
this.actionClick.emit();
|
|
162
166
|
}
|
|
163
167
|
}
|
|
164
|
-
|
|
165
|
-
SkySummaryActionBarSecondaryActionComponent.ɵ
|
|
166
|
-
i0.ɵɵ
|
|
168
|
+
_SkySummaryActionBarSecondaryActionComponent__isDropdown = new WeakMap(), _SkySummaryActionBarSecondaryActionComponent_changeDetector = new WeakMap();
|
|
169
|
+
SkySummaryActionBarSecondaryActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarSecondaryActionComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
170
|
+
SkySummaryActionBarSecondaryActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.11", type: SkySummaryActionBarSecondaryActionComponent, selector: "sky-summary-action-bar-secondary-action", inputs: { disabled: "disabled" }, outputs: { actionClick: "actionClick" }, ngImport: i0, template: "<ng-container *ngIf=\"!isDropdown\">\n <button\n type=\"button\"\n class=\"sky-btn\"\n role=\"menuitem\"\n [disabled]=\"disabled\"\n [skyThemeClass]=\"{\n 'sky-btn-secondary': 'default',\n 'sky-btn-default': 'modern'\n }\"\n (click)=\"onButtonClicked()\"\n >\n <ng-container\n *ngTemplateOutlet=\"summaryActionBarSecondaryAction\"\n ></ng-container>\n </button>\n</ng-container>\n<sky-dropdown-item *ngIf=\"isDropdown\">\n <button type=\"button\" [disabled]=\"disabled\" (click)=\"onButtonClicked()\">\n <ng-container\n *ngTemplateOutlet=\"summaryActionBarSecondaryAction\"\n ></ng-container>\n </button>\n</sky-dropdown-item>\n\n<ng-template #summaryActionBarSecondaryAction>\n <ng-content></ng-content>\n</ng-template>\n", styles: [".sky-btn{margin-right:10px}:host-context(.sky-theme-modern) .sky-btn{margin-right:10px}.sky-theme-modern .sky-btn{margin-right:10px}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3$1.λ1, selector: "sky-dropdown-item", inputs: ["ariaRole"] }, { kind: "directive", type: i5.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
171
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarSecondaryActionComponent, decorators: [{
|
|
167
172
|
type: Component,
|
|
168
173
|
args: [{ selector: 'sky-summary-action-bar-secondary-action', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!isDropdown\">\n <button\n type=\"button\"\n class=\"sky-btn\"\n role=\"menuitem\"\n [disabled]=\"disabled\"\n [skyThemeClass]=\"{\n 'sky-btn-secondary': 'default',\n 'sky-btn-default': 'modern'\n }\"\n (click)=\"onButtonClicked()\"\n >\n <ng-container\n *ngTemplateOutlet=\"summaryActionBarSecondaryAction\"\n ></ng-container>\n </button>\n</ng-container>\n<sky-dropdown-item *ngIf=\"isDropdown\">\n <button type=\"button\" [disabled]=\"disabled\" (click)=\"onButtonClicked()\">\n <ng-container\n *ngTemplateOutlet=\"summaryActionBarSecondaryAction\"\n ></ng-container>\n </button>\n</sky-dropdown-item>\n\n<ng-template #summaryActionBarSecondaryAction>\n <ng-content></ng-content>\n</ng-template>\n", styles: [".sky-btn{margin-right:10px}:host-context(.sky-theme-modern) .sky-btn{margin-right:10px}.sky-theme-modern .sky-btn{margin-right:10px}\n"] }]
|
|
169
174
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { disabled: [{
|
|
@@ -172,60 +177,66 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImpor
|
|
|
172
177
|
type: Output
|
|
173
178
|
}] } });
|
|
174
179
|
|
|
180
|
+
var _SkySummaryActionBarSecondaryActionsComponent_instances, _SkySummaryActionBarSecondaryActionsComponent_mediaQuerySubscription, _SkySummaryActionBarSecondaryActionsComponent_actionChanges, _SkySummaryActionBarSecondaryActionsComponent_actionClicks, _SkySummaryActionBarSecondaryActionsComponent_changeDetector, _SkySummaryActionBarSecondaryActionsComponent_mediaQueryService, _SkySummaryActionBarSecondaryActionsComponent_checkAndUpdateChildrenType;
|
|
175
181
|
/**
|
|
176
182
|
* Contains secondary actions specified with `sky-summary-action-bar-secondary-action`
|
|
177
183
|
* components.
|
|
178
184
|
*/
|
|
179
185
|
class SkySummaryActionBarSecondaryActionsComponent {
|
|
180
186
|
constructor(changeDetector, mediaQueryService) {
|
|
181
|
-
this
|
|
182
|
-
this.mediaQueryService = mediaQueryService;
|
|
187
|
+
_SkySummaryActionBarSecondaryActionsComponent_instances.add(this);
|
|
183
188
|
this.isMobile = false;
|
|
184
189
|
this.dropdownMessageStream = new Subject();
|
|
185
|
-
this
|
|
190
|
+
_SkySummaryActionBarSecondaryActionsComponent_mediaQuerySubscription.set(this, void 0);
|
|
191
|
+
_SkySummaryActionBarSecondaryActionsComponent_actionChanges.set(this, void 0);
|
|
192
|
+
_SkySummaryActionBarSecondaryActionsComponent_actionClicks.set(this, []);
|
|
193
|
+
_SkySummaryActionBarSecondaryActionsComponent_changeDetector.set(this, void 0);
|
|
194
|
+
_SkySummaryActionBarSecondaryActionsComponent_mediaQueryService.set(this, void 0);
|
|
195
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarSecondaryActionsComponent_changeDetector, changeDetector, "f");
|
|
196
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarSecondaryActionsComponent_mediaQueryService, mediaQueryService, "f");
|
|
186
197
|
}
|
|
187
198
|
ngAfterContentInit() {
|
|
188
|
-
this
|
|
199
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarSecondaryActionsComponent_mediaQuerySubscription, __classPrivateFieldGet(this, _SkySummaryActionBarSecondaryActionsComponent_mediaQueryService, "f").subscribe((args) => {
|
|
189
200
|
this.isMobile = args === SkyMediaBreakpoints.xs;
|
|
190
|
-
this.
|
|
191
|
-
});
|
|
192
|
-
this
|
|
193
|
-
this.
|
|
194
|
-
});
|
|
195
|
-
if (this.
|
|
201
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarSecondaryActionsComponent_instances, "m", _SkySummaryActionBarSecondaryActionsComponent_checkAndUpdateChildrenType).call(this);
|
|
202
|
+
}), "f");
|
|
203
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarSecondaryActionsComponent_actionChanges, this.secondaryActionComponents?.changes.subscribe(() => {
|
|
204
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarSecondaryActionsComponent_instances, "m", _SkySummaryActionBarSecondaryActionsComponent_checkAndUpdateChildrenType).call(this);
|
|
205
|
+
}), "f");
|
|
206
|
+
if (__classPrivateFieldGet(this, _SkySummaryActionBarSecondaryActionsComponent_mediaQueryService, "f").current === SkyMediaBreakpoints.xs) {
|
|
196
207
|
this.isMobile = true;
|
|
197
208
|
}
|
|
198
|
-
this.
|
|
209
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarSecondaryActionsComponent_instances, "m", _SkySummaryActionBarSecondaryActionsComponent_checkAndUpdateChildrenType).call(this);
|
|
199
210
|
}
|
|
200
211
|
ngOnDestroy() {
|
|
201
|
-
this
|
|
202
|
-
this
|
|
203
|
-
this.
|
|
212
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarSecondaryActionsComponent_mediaQuerySubscription, "f")?.unsubscribe();
|
|
213
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarSecondaryActionsComponent_actionChanges, "f")?.unsubscribe();
|
|
214
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarSecondaryActionsComponent_actionClicks, "f").forEach((actionClick) => actionClick.unsubscribe());
|
|
204
215
|
}
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
this.secondaryActionComponents.forEach((action) => {
|
|
213
|
-
action.isDropdown = isDropdown;
|
|
214
|
-
this.actionClicks.push(action.actionClick.subscribe(() => {
|
|
215
|
-
this.dropdownMessageStream.next({
|
|
216
|
-
type: SkyDropdownMessageType.Close,
|
|
217
|
-
});
|
|
218
|
-
}));
|
|
219
|
-
});
|
|
216
|
+
}
|
|
217
|
+
_SkySummaryActionBarSecondaryActionsComponent_mediaQuerySubscription = new WeakMap(), _SkySummaryActionBarSecondaryActionsComponent_actionChanges = new WeakMap(), _SkySummaryActionBarSecondaryActionsComponent_actionClicks = new WeakMap(), _SkySummaryActionBarSecondaryActionsComponent_changeDetector = new WeakMap(), _SkySummaryActionBarSecondaryActionsComponent_mediaQueryService = new WeakMap(), _SkySummaryActionBarSecondaryActionsComponent_instances = new WeakSet(), _SkySummaryActionBarSecondaryActionsComponent_checkAndUpdateChildrenType = function _SkySummaryActionBarSecondaryActionsComponent_checkAndUpdateChildrenType() {
|
|
218
|
+
/* istanbul ignore else */
|
|
219
|
+
if (this.secondaryActionComponents) {
|
|
220
|
+
let isDropdown = false;
|
|
221
|
+
if (this.secondaryActionComponents.length >= 5 || this.isMobile) {
|
|
222
|
+
isDropdown = true;
|
|
220
223
|
}
|
|
221
|
-
this.
|
|
224
|
+
this.secondaryActionComponents.forEach((action) => {
|
|
225
|
+
action.isDropdown = isDropdown;
|
|
226
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarSecondaryActionsComponent_actionClicks, "f").push(action.actionClick.subscribe(() => {
|
|
227
|
+
this.dropdownMessageStream.next({
|
|
228
|
+
type: SkyDropdownMessageType.Close,
|
|
229
|
+
});
|
|
230
|
+
}));
|
|
231
|
+
});
|
|
222
232
|
}
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
SkySummaryActionBarSecondaryActionsComponent.ɵ
|
|
226
|
-
i0.ɵɵ
|
|
233
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarSecondaryActionsComponent_changeDetector, "f").detectChanges();
|
|
234
|
+
};
|
|
235
|
+
SkySummaryActionBarSecondaryActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarSecondaryActionsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i2.SkyMediaQueryService }], target: i0.ɵɵFactoryTarget.Component });
|
|
236
|
+
SkySummaryActionBarSecondaryActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.11", type: SkySummaryActionBarSecondaryActionsComponent, selector: "sky-summary-action-bar-secondary-actions", queries: [{ propertyName: "secondaryActionComponents", predicate: SkySummaryActionBarSecondaryActionComponent }], ngImport: i0, template: "<div\n *ngIf=\"\n !isMobile &&\n secondaryActionComponents &&\n secondaryActionComponents.length < 5\n \"\n class=\"sky-summary-action-bar-secondary-buttons\"\n role=\"menubar\"\n>\n <ng-container\n *ngTemplateOutlet=\"summaryActionBarSecondaryActions\"\n ></ng-container>\n</div>\n<div\n *ngIf=\"\n isMobile ||\n (secondaryActionComponents && secondaryActionComponents.length > 4)\n \"\n>\n <sky-dropdown\n buttonType=\"select\"\n [attr.title]=\"'skyux_summary_action_bar_open_secondary' | skyLibResources\"\n [messageStream]=\"dropdownMessageStream\"\n >\n <sky-dropdown-button>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"ellipsis\"\n iconType=\"skyux\"\n ></sky-icon>\n <sky-icon *skyThemeIf=\"'default'\" icon=\"ellipsis-h\"></sky-icon>\n </sky-dropdown-button>\n <sky-dropdown-menu>\n <ng-container\n *ngTemplateOutlet=\"summaryActionBarSecondaryActions\"\n ></ng-container>\n </sky-dropdown-menu>\n </sky-dropdown>\n</div>\n<ng-template #summaryActionBarSecondaryActions>\n <ng-content select=\"sky-summary-action-bar-secondary-action\"></ng-content>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3$1.λ2, selector: "sky-dropdown-button" }, { kind: "component", type: i3$1.λ3, selector: "sky-dropdown", inputs: ["buttonStyle", "buttonType", "disabled", "dismissOnBlur", "label", "horizontalAlignment", "messageStream", "title", "trigger"] }, { kind: "component", type: i3$1.λ4, selector: "sky-dropdown-menu", inputs: ["ariaLabelledBy", "ariaRole", "useNativeFocus"], outputs: ["menuChanges"] }, { kind: "component", type: i4.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i5.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { kind: "pipe", type: i6.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
237
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarSecondaryActionsComponent, decorators: [{
|
|
227
238
|
type: Component,
|
|
228
|
-
args: [{ selector: 'sky-summary-action-bar-secondary-actions', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *ngIf=\"!isMobile
|
|
239
|
+
args: [{ selector: 'sky-summary-action-bar-secondary-actions', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *ngIf=\"\n !isMobile &&\n secondaryActionComponents &&\n secondaryActionComponents.length < 5\n \"\n class=\"sky-summary-action-bar-secondary-buttons\"\n role=\"menubar\"\n>\n <ng-container\n *ngTemplateOutlet=\"summaryActionBarSecondaryActions\"\n ></ng-container>\n</div>\n<div\n *ngIf=\"\n isMobile ||\n (secondaryActionComponents && secondaryActionComponents.length > 4)\n \"\n>\n <sky-dropdown\n buttonType=\"select\"\n [attr.title]=\"'skyux_summary_action_bar_open_secondary' | skyLibResources\"\n [messageStream]=\"dropdownMessageStream\"\n >\n <sky-dropdown-button>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"ellipsis\"\n iconType=\"skyux\"\n ></sky-icon>\n <sky-icon *skyThemeIf=\"'default'\" icon=\"ellipsis-h\"></sky-icon>\n </sky-dropdown-button>\n <sky-dropdown-menu>\n <ng-container\n *ngTemplateOutlet=\"summaryActionBarSecondaryActions\"\n ></ng-container>\n </sky-dropdown-menu>\n </sky-dropdown>\n</div>\n<ng-template #summaryActionBarSecondaryActions>\n <ng-content select=\"sky-summary-action-bar-secondary-action\"></ng-content>\n</ng-template>\n" }]
|
|
229
240
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i2.SkyMediaQueryService }]; }, propDecorators: { secondaryActionComponents: [{
|
|
230
241
|
type: ContentChildren,
|
|
231
242
|
args: [SkySummaryActionBarSecondaryActionComponent]
|
|
@@ -243,25 +254,42 @@ var SkySummaryActionBarType;
|
|
|
243
254
|
SkySummaryActionBarType[SkySummaryActionBarType["SplitView"] = 4] = "SplitView";
|
|
244
255
|
})(SkySummaryActionBarType || (SkySummaryActionBarType = {}));
|
|
245
256
|
|
|
257
|
+
class SkySummaryActionBarCollapsiblePipe {
|
|
258
|
+
transform(summaryActionBarType, mediaBreakpoint) {
|
|
259
|
+
return (summaryActionBarType === SkySummaryActionBarType.StandardModal ||
|
|
260
|
+
mediaBreakpoint === SkyMediaBreakpoints.xs);
|
|
261
|
+
}
|
|
262
|
+
}
|
|
263
|
+
SkySummaryActionBarCollapsiblePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarCollapsiblePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
264
|
+
SkySummaryActionBarCollapsiblePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarCollapsiblePipe, name: "skySummaryActionBarCollapsible" });
|
|
265
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarCollapsiblePipe, decorators: [{
|
|
266
|
+
type: Pipe,
|
|
267
|
+
args: [{
|
|
268
|
+
name: 'skySummaryActionBarCollapsible',
|
|
269
|
+
}]
|
|
270
|
+
}] });
|
|
271
|
+
|
|
272
|
+
var _SkySummaryActionBarAdapterService_renderer, _SkySummaryActionBarAdapterService_windowRef;
|
|
246
273
|
/**
|
|
247
274
|
* @internal
|
|
248
275
|
*/
|
|
249
276
|
class SkySummaryActionBarAdapterService {
|
|
250
277
|
constructor(rendererFactory, windowRef) {
|
|
251
|
-
this
|
|
252
|
-
this
|
|
253
|
-
this
|
|
278
|
+
_SkySummaryActionBarAdapterService_renderer.set(this, void 0);
|
|
279
|
+
_SkySummaryActionBarAdapterService_windowRef.set(this, void 0);
|
|
280
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarAdapterService_windowRef, windowRef, "f");
|
|
281
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarAdapterService_renderer, rendererFactory.createRenderer(undefined, null), "f");
|
|
254
282
|
}
|
|
255
283
|
focusChevron(chevronElement) {
|
|
256
|
-
chevronElement
|
|
284
|
+
chevronElement?.nativeElement.querySelector('.sky-chevron').focus();
|
|
257
285
|
}
|
|
258
286
|
styleBodyElementForActionBar(summaryActionBarRef) {
|
|
259
|
-
const window = this.
|
|
287
|
+
const window = __classPrivateFieldGet(this, _SkySummaryActionBarAdapterService_windowRef, "f").nativeWindow;
|
|
260
288
|
const body = window.document.body;
|
|
261
289
|
const actionBarEl = summaryActionBarRef.nativeElement.querySelector('.sky-summary-action-bar');
|
|
262
290
|
/* istanbul ignore else */
|
|
263
291
|
if (actionBarEl.style.visibility !== 'hidden') {
|
|
264
|
-
this.
|
|
292
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarAdapterService_renderer, "f").setStyle(body, 'margin-bottom', actionBarEl.offsetHeight + 'px');
|
|
265
293
|
}
|
|
266
294
|
}
|
|
267
295
|
styleSplitViewElementForActionBar(summaryActionBarRef) {
|
|
@@ -270,33 +298,33 @@ class SkySummaryActionBarAdapterService {
|
|
|
270
298
|
const actionBarEl = summaryActionBarRef.nativeElement.querySelector('.sky-summary-action-bar');
|
|
271
299
|
/* istanbul ignore else */
|
|
272
300
|
if (actionBarEl.style.visibility !== 'hidden') {
|
|
273
|
-
this.
|
|
274
|
-
this.
|
|
301
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarAdapterService_renderer, "f").setStyle(splitViewWorkspaceContent, 'padding-bottom', '20px');
|
|
302
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarAdapterService_renderer, "f").setStyle(splitViewWorkspaceFooter, 'padding', 0);
|
|
275
303
|
}
|
|
276
304
|
}
|
|
277
305
|
revertBodyElementStyles() {
|
|
278
|
-
const window = this.
|
|
306
|
+
const window = __classPrivateFieldGet(this, _SkySummaryActionBarAdapterService_windowRef, "f").nativeWindow;
|
|
279
307
|
const body = window.document.body;
|
|
280
|
-
this.
|
|
308
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarAdapterService_renderer, "f").removeStyle(body, 'margin-bottom');
|
|
281
309
|
}
|
|
282
310
|
revertSplitViewElementStyles() {
|
|
283
311
|
const splitViewWorkspaceContent = document.querySelector('.sky-split-view-workspace-content');
|
|
284
312
|
const splitViewWorkspaceFooter = document.querySelector('.sky-split-view-workspace-footer');
|
|
285
|
-
this.
|
|
286
|
-
this.
|
|
313
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarAdapterService_renderer, "f").setStyle(splitViewWorkspaceContent, 'padding-bottom', 'none');
|
|
314
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarAdapterService_renderer, "f").setStyle(splitViewWorkspaceFooter, 'padding', '10px');
|
|
287
315
|
}
|
|
288
316
|
styleModalFooter(summaryActionBarRef) {
|
|
289
317
|
const modalFooterEls = document.getElementsByClassName('sky-modal-footer-container');
|
|
290
318
|
for (let i = 0; i < modalFooterEls.length; i++) {
|
|
291
|
-
if (modalFooterEls.item(i)
|
|
292
|
-
this.
|
|
319
|
+
if (modalFooterEls.item(i)?.contains(summaryActionBarRef.nativeElement)) {
|
|
320
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarAdapterService_renderer, "f").setStyle(modalFooterEls.item(i), 'padding', 0);
|
|
293
321
|
}
|
|
294
322
|
}
|
|
295
323
|
}
|
|
296
324
|
getSummaryActionBarType(el) {
|
|
297
|
-
|
|
325
|
+
while (el && el.nodeType === 1) {
|
|
298
326
|
if (el.tagName.toLowerCase() === 'sky-modal-footer') {
|
|
299
|
-
while (el.tagName.toLowerCase() !== 'sky-modal') {
|
|
327
|
+
while (el && el.tagName.toLowerCase() !== 'sky-modal') {
|
|
300
328
|
if (el.classList.contains('sky-modal-full-page')) {
|
|
301
329
|
return SkySummaryActionBarType.FullPageModal;
|
|
302
330
|
}
|
|
@@ -311,13 +339,14 @@ class SkySummaryActionBarAdapterService {
|
|
|
311
339
|
return SkySummaryActionBarType.SplitView;
|
|
312
340
|
}
|
|
313
341
|
el = el.parentElement;
|
|
314
|
-
}
|
|
342
|
+
}
|
|
315
343
|
return SkySummaryActionBarType.Page;
|
|
316
344
|
}
|
|
317
345
|
}
|
|
318
|
-
|
|
319
|
-
SkySummaryActionBarAdapterService.ɵ
|
|
320
|
-
i0.ɵɵ
|
|
346
|
+
_SkySummaryActionBarAdapterService_renderer = new WeakMap(), _SkySummaryActionBarAdapterService_windowRef = new WeakMap();
|
|
347
|
+
SkySummaryActionBarAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarAdapterService, deps: [{ token: i0.RendererFactory2 }, { token: i2.SkyAppWindowRef }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
348
|
+
SkySummaryActionBarAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarAdapterService });
|
|
349
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarAdapterService, decorators: [{
|
|
321
350
|
type: Injectable
|
|
322
351
|
}], ctorParameters: function () { return [{ type: i0.RendererFactory2 }, { type: i2.SkyAppWindowRef }]; } });
|
|
323
352
|
|
|
@@ -326,13 +355,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImpor
|
|
|
326
355
|
*/
|
|
327
356
|
class SkySummaryActionBarSummaryComponent {
|
|
328
357
|
}
|
|
329
|
-
SkySummaryActionBarSummaryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.
|
|
330
|
-
SkySummaryActionBarSummaryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.
|
|
331
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.
|
|
358
|
+
SkySummaryActionBarSummaryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
359
|
+
SkySummaryActionBarSummaryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.11", type: SkySummaryActionBarSummaryComponent, selector: "sky-summary-action-bar-summary", ngImport: i0, template: "<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
360
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarSummaryComponent, decorators: [{
|
|
332
361
|
type: Component,
|
|
333
362
|
args: [{ selector: 'sky-summary-action-bar-summary', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n" }]
|
|
334
363
|
}] });
|
|
335
364
|
|
|
365
|
+
var _SkySummaryActionBarComponent_instances, _SkySummaryActionBarComponent_mediaQuerySubscription, _SkySummaryActionBarComponent_observer, _SkySummaryActionBarComponent_idled, _SkySummaryActionBarComponent_adapterService, _SkySummaryActionBarComponent_changeDetector, _SkySummaryActionBarComponent_elementRef, _SkySummaryActionBarComponent_observerService, _SkySummaryActionBarComponent_windowRef, _SkySummaryActionBarComponent__summaryElement, _SkySummaryActionBarComponent_setupReactiveState, _SkySummaryActionBarComponent_removeTabListener, _SkySummaryActionBarComponent_setupResizeListener, _SkySummaryActionBarComponent_removeResizeListener;
|
|
336
366
|
/**
|
|
337
367
|
* Auto-incrementing integer used to generate unique ids for summary action bar components.
|
|
338
368
|
*/
|
|
@@ -343,73 +373,77 @@ let nextId = 0;
|
|
|
343
373
|
*/
|
|
344
374
|
class SkySummaryActionBarComponent {
|
|
345
375
|
constructor(adapterService, changeDetector, elementRef, mediaQueryService, observerService, windowRef) {
|
|
346
|
-
this.adapterService = adapterService;
|
|
347
|
-
this.changeDetector = changeDetector;
|
|
348
|
-
this.elementRef = elementRef;
|
|
349
376
|
this.mediaQueryService = mediaQueryService;
|
|
350
|
-
this
|
|
351
|
-
this.windowRef = windowRef;
|
|
377
|
+
_SkySummaryActionBarComponent_instances.add(this);
|
|
352
378
|
this.isSummaryCollapsed = false;
|
|
353
379
|
this.slideDirection = 'down';
|
|
354
380
|
this.summaryId = `sky-summary-action-bar-summary-${++nextId}`;
|
|
355
|
-
this
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
381
|
+
_SkySummaryActionBarComponent_mediaQuerySubscription.set(this, void 0);
|
|
382
|
+
_SkySummaryActionBarComponent_observer.set(this, void 0);
|
|
383
|
+
_SkySummaryActionBarComponent_idled.set(this, new Subject());
|
|
384
|
+
_SkySummaryActionBarComponent_adapterService.set(this, void 0);
|
|
385
|
+
_SkySummaryActionBarComponent_changeDetector.set(this, void 0);
|
|
386
|
+
_SkySummaryActionBarComponent_elementRef.set(this, void 0);
|
|
387
|
+
_SkySummaryActionBarComponent_observerService.set(this, void 0);
|
|
388
|
+
_SkySummaryActionBarComponent_windowRef.set(this, void 0);
|
|
389
|
+
_SkySummaryActionBarComponent__summaryElement.set(this, void 0);
|
|
390
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarComponent_adapterService, adapterService, "f");
|
|
391
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarComponent_changeDetector, changeDetector, "f");
|
|
392
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarComponent_elementRef, elementRef, "f");
|
|
393
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarComponent_observerService, observerService, "f");
|
|
394
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarComponent_windowRef, windowRef, "f");
|
|
360
395
|
}
|
|
361
396
|
set summaryElement(element) {
|
|
362
|
-
this
|
|
363
|
-
this.
|
|
397
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarComponent__summaryElement, element, "f");
|
|
398
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_changeDetector, "f").markForCheck();
|
|
364
399
|
}
|
|
365
400
|
get summaryElement() {
|
|
366
|
-
return this
|
|
401
|
+
return __classPrivateFieldGet(this, _SkySummaryActionBarComponent__summaryElement, "f");
|
|
367
402
|
}
|
|
368
403
|
ngAfterViewInit() {
|
|
369
|
-
this.type = this.
|
|
404
|
+
this.type = __classPrivateFieldGet(this, _SkySummaryActionBarComponent_adapterService, "f").getSummaryActionBarType(__classPrivateFieldGet(this, _SkySummaryActionBarComponent_elementRef, "f").nativeElement);
|
|
370
405
|
if (!(this.type === SkySummaryActionBarType.FullPageModal ||
|
|
371
406
|
this.type === SkySummaryActionBarType.StandardModal)) {
|
|
372
|
-
this.
|
|
407
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_instances, "m", _SkySummaryActionBarComponent_setupReactiveState).call(this);
|
|
373
408
|
if (this.type === SkySummaryActionBarType.SplitView) {
|
|
374
|
-
this.
|
|
409
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_adapterService, "f").styleSplitViewElementForActionBar(__classPrivateFieldGet(this, _SkySummaryActionBarComponent_elementRef, "f"));
|
|
375
410
|
}
|
|
376
411
|
else {
|
|
377
|
-
this.
|
|
412
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_adapterService, "f").styleBodyElementForActionBar(__classPrivateFieldGet(this, _SkySummaryActionBarComponent_elementRef, "f"));
|
|
378
413
|
}
|
|
379
|
-
this.
|
|
414
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_instances, "m", _SkySummaryActionBarComponent_setupResizeListener).call(this);
|
|
380
415
|
if (this.type === SkySummaryActionBarType.Tab) {
|
|
381
416
|
this.setupTabListener();
|
|
382
417
|
}
|
|
383
418
|
}
|
|
384
419
|
else {
|
|
385
|
-
this.
|
|
420
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_adapterService, "f").styleModalFooter(__classPrivateFieldGet(this, _SkySummaryActionBarComponent_elementRef, "f"));
|
|
386
421
|
if (this.type === SkySummaryActionBarType.FullPageModal) {
|
|
387
|
-
this.
|
|
422
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_instances, "m", _SkySummaryActionBarComponent_setupReactiveState).call(this);
|
|
388
423
|
}
|
|
389
424
|
}
|
|
390
|
-
this.
|
|
425
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_changeDetector, "f").detectChanges();
|
|
391
426
|
}
|
|
392
427
|
ngOnDestroy() {
|
|
393
428
|
if (this.type === SkySummaryActionBarType.SplitView) {
|
|
394
|
-
this.
|
|
429
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_adapterService, "f").revertSplitViewElementStyles();
|
|
395
430
|
}
|
|
396
431
|
else if (this.type === SkySummaryActionBarType.Page ||
|
|
397
432
|
this.type === SkySummaryActionBarType.Tab) {
|
|
398
|
-
this.
|
|
433
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_adapterService, "f").revertBodyElementStyles();
|
|
399
434
|
}
|
|
400
|
-
this.
|
|
401
|
-
this.
|
|
402
|
-
if (this
|
|
403
|
-
this.
|
|
435
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_instances, "m", _SkySummaryActionBarComponent_removeResizeListener).call(this);
|
|
436
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_instances, "m", _SkySummaryActionBarComponent_removeTabListener).call(this);
|
|
437
|
+
if (__classPrivateFieldGet(this, _SkySummaryActionBarComponent_mediaQuerySubscription, "f")) {
|
|
438
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_mediaQuerySubscription, "f").unsubscribe();
|
|
404
439
|
}
|
|
405
|
-
this.
|
|
440
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_idled, "f").complete();
|
|
406
441
|
}
|
|
407
442
|
onDirectionChange(direction) {
|
|
408
443
|
this.slideDirection = direction;
|
|
409
444
|
}
|
|
410
445
|
summaryContentExists() {
|
|
411
|
-
return (this.summaryElement
|
|
412
|
-
this.summaryElement.nativeElement.children.length > 0);
|
|
446
|
+
return !!(this.summaryElement?.nativeElement.children.length || 0 > 0);
|
|
413
447
|
}
|
|
414
448
|
// NOTE: This function is needed so that the button is not removed until post-animation
|
|
415
449
|
summaryTransitionEnd(animationEvent) {
|
|
@@ -417,15 +451,15 @@ class SkySummaryActionBarComponent {
|
|
|
417
451
|
animationEvent.fromState !== 'void') {
|
|
418
452
|
if (this.slideDirection === 'up') {
|
|
419
453
|
this.isSummaryCollapsed = true;
|
|
420
|
-
this.
|
|
454
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_changeDetector, "f").markForCheck();
|
|
421
455
|
}
|
|
422
456
|
if (this.type === SkySummaryActionBarType.Page ||
|
|
423
457
|
this.type === SkySummaryActionBarType.Tab) {
|
|
424
|
-
this.
|
|
458
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_adapterService, "f").styleBodyElementForActionBar(__classPrivateFieldGet(this, _SkySummaryActionBarComponent_elementRef, "f"));
|
|
425
459
|
}
|
|
426
460
|
// Ensure that the correct chevron is fully rendered prior to setting focus.
|
|
427
461
|
setTimeout(() => {
|
|
428
|
-
this.
|
|
462
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_adapterService, "f").focusChevron(this.chevronElementRef);
|
|
429
463
|
});
|
|
430
464
|
}
|
|
431
465
|
}
|
|
@@ -435,30 +469,21 @@ class SkySummaryActionBarComponent {
|
|
|
435
469
|
this.isSummaryCollapsed = false;
|
|
436
470
|
}
|
|
437
471
|
}
|
|
438
|
-
setupReactiveState() {
|
|
439
|
-
this.mediaQuerySubscription = this.mediaQueryService.subscribe((args) => {
|
|
440
|
-
if (args !== SkyMediaBreakpoints.xs) {
|
|
441
|
-
this.isSummaryCollapsed = false;
|
|
442
|
-
this.slideDirection = 'down';
|
|
443
|
-
}
|
|
444
|
-
this.changeDetector.detectChanges();
|
|
445
|
-
});
|
|
446
|
-
}
|
|
447
472
|
setupTabListener() {
|
|
448
473
|
/* istanbul ignore else */
|
|
449
|
-
if (!this
|
|
450
|
-
this
|
|
474
|
+
if (!__classPrivateFieldGet(this, _SkySummaryActionBarComponent_observer, "f")) {
|
|
475
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarComponent_observer, __classPrivateFieldGet(this, _SkySummaryActionBarComponent_observerService, "f").create((mutations) => {
|
|
451
476
|
if (mutations[0].target.attributes.getNamedItem('hidden')) {
|
|
452
|
-
this.
|
|
453
|
-
this.
|
|
477
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_adapterService, "f").revertBodyElementStyles();
|
|
478
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_instances, "m", _SkySummaryActionBarComponent_removeResizeListener).call(this);
|
|
454
479
|
}
|
|
455
480
|
else {
|
|
456
481
|
setTimeout(() => {
|
|
457
|
-
this.
|
|
458
|
-
this.
|
|
482
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_adapterService, "f").styleBodyElementForActionBar(__classPrivateFieldGet(this, _SkySummaryActionBarComponent_elementRef, "f"));
|
|
483
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_instances, "m", _SkySummaryActionBarComponent_setupResizeListener).call(this);
|
|
459
484
|
});
|
|
460
485
|
}
|
|
461
|
-
});
|
|
486
|
+
}), "f");
|
|
462
487
|
}
|
|
463
488
|
const config = {
|
|
464
489
|
attributes: true,
|
|
@@ -466,38 +491,44 @@ class SkySummaryActionBarComponent {
|
|
|
466
491
|
childList: false,
|
|
467
492
|
characterDate: false,
|
|
468
493
|
};
|
|
469
|
-
let el = this.
|
|
494
|
+
let el = __classPrivateFieldGet(this, _SkySummaryActionBarComponent_elementRef, "f").nativeElement;
|
|
470
495
|
do {
|
|
471
496
|
if (el.classList.contains('sky-tab')) {
|
|
472
|
-
this.
|
|
497
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_observer, "f").observe(el, config);
|
|
473
498
|
}
|
|
474
499
|
el = el.parentElement;
|
|
475
500
|
} while (el !== null && el.nodeType === 1);
|
|
476
501
|
}
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
if (this.type !== SkySummaryActionBarType.SplitView) {
|
|
484
|
-
const windowObj = this.windowRef.nativeWindow;
|
|
485
|
-
fromEvent(windowObj, 'resize')
|
|
486
|
-
.pipe(takeUntil(this.idled))
|
|
487
|
-
.subscribe(() => {
|
|
488
|
-
this.adapterService.styleBodyElementForActionBar(this.elementRef);
|
|
489
|
-
});
|
|
502
|
+
}
|
|
503
|
+
_SkySummaryActionBarComponent_mediaQuerySubscription = new WeakMap(), _SkySummaryActionBarComponent_observer = new WeakMap(), _SkySummaryActionBarComponent_idled = new WeakMap(), _SkySummaryActionBarComponent_adapterService = new WeakMap(), _SkySummaryActionBarComponent_changeDetector = new WeakMap(), _SkySummaryActionBarComponent_elementRef = new WeakMap(), _SkySummaryActionBarComponent_observerService = new WeakMap(), _SkySummaryActionBarComponent_windowRef = new WeakMap(), _SkySummaryActionBarComponent__summaryElement = new WeakMap(), _SkySummaryActionBarComponent_instances = new WeakSet(), _SkySummaryActionBarComponent_setupReactiveState = function _SkySummaryActionBarComponent_setupReactiveState() {
|
|
504
|
+
__classPrivateFieldSet(this, _SkySummaryActionBarComponent_mediaQuerySubscription, this.mediaQueryService.subscribe((args) => {
|
|
505
|
+
if (args !== SkyMediaBreakpoints.xs) {
|
|
506
|
+
this.isSummaryCollapsed = false;
|
|
507
|
+
this.slideDirection = 'down';
|
|
490
508
|
}
|
|
509
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_changeDetector, "f").detectChanges();
|
|
510
|
+
}), "f");
|
|
511
|
+
}, _SkySummaryActionBarComponent_removeTabListener = function _SkySummaryActionBarComponent_removeTabListener() {
|
|
512
|
+
if (__classPrivateFieldGet(this, _SkySummaryActionBarComponent_observer, "f")) {
|
|
513
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_observer, "f").disconnect();
|
|
514
|
+
}
|
|
515
|
+
}, _SkySummaryActionBarComponent_setupResizeListener = function _SkySummaryActionBarComponent_setupResizeListener() {
|
|
516
|
+
if (this.type !== SkySummaryActionBarType.SplitView) {
|
|
517
|
+
const windowObj = __classPrivateFieldGet(this, _SkySummaryActionBarComponent_windowRef, "f").nativeWindow;
|
|
518
|
+
fromEvent(windowObj, 'resize')
|
|
519
|
+
.pipe(takeUntil(__classPrivateFieldGet(this, _SkySummaryActionBarComponent_idled, "f")))
|
|
520
|
+
.subscribe(() => {
|
|
521
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_adapterService, "f").styleBodyElementForActionBar(__classPrivateFieldGet(this, _SkySummaryActionBarComponent_elementRef, "f"));
|
|
522
|
+
});
|
|
491
523
|
}
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
}
|
|
496
|
-
SkySummaryActionBarComponent.ɵ
|
|
497
|
-
|
|
498
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: SkySummaryActionBarComponent, decorators: [{
|
|
524
|
+
}, _SkySummaryActionBarComponent_removeResizeListener = function _SkySummaryActionBarComponent_removeResizeListener() {
|
|
525
|
+
__classPrivateFieldGet(this, _SkySummaryActionBarComponent_idled, "f").next(true);
|
|
526
|
+
};
|
|
527
|
+
SkySummaryActionBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarComponent, deps: [{ token: SkySummaryActionBarAdapterService }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i2.SkyMediaQueryService }, { token: i2.SkyMutationObserverService }, { token: i2.SkyAppWindowRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
528
|
+
SkySummaryActionBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.11", type: SkySummaryActionBarComponent, selector: "sky-summary-action-bar", providers: [SkySummaryActionBarAdapterService], queries: [{ propertyName: "summaryElement", first: true, predicate: SkySummaryActionBarSummaryComponent, descendants: true, read: ElementRef }], viewQueries: [{ propertyName: "chevronElementRef", first: true, predicate: ["chevronEl"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n class=\"sky-summary-action-bar\"\n [ngClass]=\"{\n 'sky-summary-action-bar-summary-collapsible':\n type | skySummaryActionBarCollapsible: mediaQueryService.current,\n 'sky-summary-action-bar-modal': type === 1 || type === 2,\n 'sky-summary-action-bar-split-view': type === 4\n }\"\n>\n <div class=\"sky-summary-action-bar-actions\">\n <ng-content select=\"sky-summary-action-bar-actions\"></ng-content>\n </div>\n <ng-container *ngIf=\"summaryContentExists()\">\n <div\n class=\"sky-summary-action-bar-summary\"\n [id]=\"summaryId\"\n [@skyAnimationSlide]=\"slideDirection\"\n (@skyAnimationSlide.start)=\"summaryTransitionStart()\"\n (@skyAnimationSlide.done)=\"summaryTransitionEnd($event)\"\n >\n <div class=\"sky-summary-action-bar-summary-body\">\n <div class=\"sky-summary-action-bar-summary-items\">\n <ng-content select=\"sky-summary-action-bar-summary\"></ng-content>\n </div>\n <div\n *ngIf=\"\n (type\n | skySummaryActionBarCollapsible: mediaQueryService.current) &&\n !isSummaryCollapsed\n \"\n class=\"sky-summary-action-bar-details-collapse\"\n >\n <ng-container *ngTemplateOutlet=\"chevron\"></ng-container>\n </div>\n </div>\n </div>\n <div\n *ngIf=\"\n (type | skySummaryActionBarCollapsible: mediaQueryService.current) &&\n isSummaryCollapsed\n \"\n class=\"sky-summary-action-bar-details-expand\"\n >\n <ng-container *ngTemplateOutlet=\"chevron\"></ng-container>\n </div>\n </ng-container>\n</div>\n\n<ng-template #chevron>\n <sky-chevron\n [attr.aria-controls]=\"summaryId\"\n [ariaLabel]=\"'skyux_summary_action_bar_expand' | skyLibResources\"\n [direction]=\"isSummaryCollapsed ? 'up' : 'down'\"\n [skyThemeClass]=\"{\n 'sky-margin-inline-default': 'modern'\n }\"\n (directionChange)=\"onDirectionChange($event)\"\n #chevronEl\n >\n </sky-chevron>\n</ng-template>\n", styles: [".sky-summary-action-bar{display:flex;align-items:center;width:100%;margin-top:20px;position:fixed;bottom:0;left:0;z-index:999;background-color:#fff;box-shadow:0 -3px 3px #cdcfd2}.sky-summary-action-bar-modal,.sky-summary-action-bar-split-view{position:relative;margin-top:0}.sky-summary-action-bar-split-view{box-shadow:none}.sky-summary-action-bar-actions{padding:10px 20px 10px 10px;flex-shrink:0;background-color:#fff;z-index:999}.sky-summary-action-bar-summary{margin:10px 0;border-left:1px solid #e2e3e4}.sky-summary-action-bar-summary-body{padding-left:20px;display:flex}.sky-summary-action-bar-summary-items{display:flex;flex-wrap:wrap;flex-grow:1;margin-right:10px}.sky-summary-action-bar-details-expand{margin-left:auto;margin-right:10px}.sky-summary-action-bar-details-expand,.sky-summary-action-bar-details-collapse{display:none}.sky-summary-action-bar-summary-collapsible.sky-summary-action-bar{flex-wrap:wrap}.sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-summary{order:-1;width:100%;border-bottom:1px solid #e2e3e4;margin:0;border-left:none;z-index:998}.sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-summary-body{padding:10px}.sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-details-expand,.sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-details-collapse{display:block}:host-context(.sky-theme-modern) .sky-summary-action-bar-actions{padding:20px 30px}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary{border:none}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary-body{padding-left:30px}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-actions{padding:20px}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-summary-body{padding:20px}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary-items{margin-bottom:-10px}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary-items ::ng-deep sky-key-info{margin:0 30px 10px 0;display:inline-block}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary-items ::ng-deep sky-key-info:last-child{margin:0 0 10px}.sky-theme-modern .sky-summary-action-bar-actions{padding:20px 30px}.sky-theme-modern .sky-summary-action-bar-summary{border:none}.sky-theme-modern .sky-summary-action-bar-summary-body{padding-left:30px}.sky-theme-modern .sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-actions,.sky-theme-modern .sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-summary-body{padding:20px}.sky-theme-modern .sky-summary-action-bar-summary-items{margin-bottom:-10px}.sky-theme-modern .sky-summary-action-bar-summary-items ::ng-deep sky-key-info{margin:0 30px 10px 0;display:inline-block}.sky-theme-modern .sky-summary-action-bar-summary-items ::ng-deep sky-key-info:last-child{margin:0 0 10px}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-summary-action-bar{background-color:#000;box-shadow:none}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-summary-action-bar-actions{background-color:#000}.sky-theme-modern.sky-theme-mode-dark .sky-summary-action-bar{background-color:#000;box-shadow:none}.sky-theme-modern.sky-theme-mode-dark .sky-summary-action-bar-actions{background-color:#000}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.λ2, selector: "sky-chevron", inputs: ["ariaControls", "ariaLabel", "direction", "disabled"], outputs: ["directionChange"] }, { kind: "directive", type: i5.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "pipe", type: i6.SkyLibResourcesPipe, name: "skyLibResources" }, { kind: "pipe", type: SkySummaryActionBarCollapsiblePipe, name: "skySummaryActionBarCollapsible" }], animations: [skyAnimationSlide], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
529
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarComponent, decorators: [{
|
|
499
530
|
type: Component,
|
|
500
|
-
args: [{ selector: 'sky-summary-action-bar', animations: [skyAnimationSlide], providers: [SkySummaryActionBarAdapterService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"sky-summary-action-bar\"\n [ngClass]=\"{\n 'sky-summary-action-bar-summary-collapsible':
|
|
531
|
+
args: [{ selector: 'sky-summary-action-bar', animations: [skyAnimationSlide], providers: [SkySummaryActionBarAdapterService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"sky-summary-action-bar\"\n [ngClass]=\"{\n 'sky-summary-action-bar-summary-collapsible':\n type | skySummaryActionBarCollapsible: mediaQueryService.current,\n 'sky-summary-action-bar-modal': type === 1 || type === 2,\n 'sky-summary-action-bar-split-view': type === 4\n }\"\n>\n <div class=\"sky-summary-action-bar-actions\">\n <ng-content select=\"sky-summary-action-bar-actions\"></ng-content>\n </div>\n <ng-container *ngIf=\"summaryContentExists()\">\n <div\n class=\"sky-summary-action-bar-summary\"\n [id]=\"summaryId\"\n [@skyAnimationSlide]=\"slideDirection\"\n (@skyAnimationSlide.start)=\"summaryTransitionStart()\"\n (@skyAnimationSlide.done)=\"summaryTransitionEnd($event)\"\n >\n <div class=\"sky-summary-action-bar-summary-body\">\n <div class=\"sky-summary-action-bar-summary-items\">\n <ng-content select=\"sky-summary-action-bar-summary\"></ng-content>\n </div>\n <div\n *ngIf=\"\n (type\n | skySummaryActionBarCollapsible: mediaQueryService.current) &&\n !isSummaryCollapsed\n \"\n class=\"sky-summary-action-bar-details-collapse\"\n >\n <ng-container *ngTemplateOutlet=\"chevron\"></ng-container>\n </div>\n </div>\n </div>\n <div\n *ngIf=\"\n (type | skySummaryActionBarCollapsible: mediaQueryService.current) &&\n isSummaryCollapsed\n \"\n class=\"sky-summary-action-bar-details-expand\"\n >\n <ng-container *ngTemplateOutlet=\"chevron\"></ng-container>\n </div>\n </ng-container>\n</div>\n\n<ng-template #chevron>\n <sky-chevron\n [attr.aria-controls]=\"summaryId\"\n [ariaLabel]=\"'skyux_summary_action_bar_expand' | skyLibResources\"\n [direction]=\"isSummaryCollapsed ? 'up' : 'down'\"\n [skyThemeClass]=\"{\n 'sky-margin-inline-default': 'modern'\n }\"\n (directionChange)=\"onDirectionChange($event)\"\n #chevronEl\n >\n </sky-chevron>\n</ng-template>\n", styles: [".sky-summary-action-bar{display:flex;align-items:center;width:100%;margin-top:20px;position:fixed;bottom:0;left:0;z-index:999;background-color:#fff;box-shadow:0 -3px 3px #cdcfd2}.sky-summary-action-bar-modal,.sky-summary-action-bar-split-view{position:relative;margin-top:0}.sky-summary-action-bar-split-view{box-shadow:none}.sky-summary-action-bar-actions{padding:10px 20px 10px 10px;flex-shrink:0;background-color:#fff;z-index:999}.sky-summary-action-bar-summary{margin:10px 0;border-left:1px solid #e2e3e4}.sky-summary-action-bar-summary-body{padding-left:20px;display:flex}.sky-summary-action-bar-summary-items{display:flex;flex-wrap:wrap;flex-grow:1;margin-right:10px}.sky-summary-action-bar-details-expand{margin-left:auto;margin-right:10px}.sky-summary-action-bar-details-expand,.sky-summary-action-bar-details-collapse{display:none}.sky-summary-action-bar-summary-collapsible.sky-summary-action-bar{flex-wrap:wrap}.sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-summary{order:-1;width:100%;border-bottom:1px solid #e2e3e4;margin:0;border-left:none;z-index:998}.sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-summary-body{padding:10px}.sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-details-expand,.sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-details-collapse{display:block}:host-context(.sky-theme-modern) .sky-summary-action-bar-actions{padding:20px 30px}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary{border:none}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary-body{padding-left:30px}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-actions{padding:20px}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-summary-body{padding:20px}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary-items{margin-bottom:-10px}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary-items ::ng-deep sky-key-info{margin:0 30px 10px 0;display:inline-block}:host-context(.sky-theme-modern) .sky-summary-action-bar-summary-items ::ng-deep sky-key-info:last-child{margin:0 0 10px}.sky-theme-modern .sky-summary-action-bar-actions{padding:20px 30px}.sky-theme-modern .sky-summary-action-bar-summary{border:none}.sky-theme-modern .sky-summary-action-bar-summary-body{padding-left:30px}.sky-theme-modern .sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-actions,.sky-theme-modern .sky-summary-action-bar-summary-collapsible .sky-summary-action-bar-summary-body{padding:20px}.sky-theme-modern .sky-summary-action-bar-summary-items{margin-bottom:-10px}.sky-theme-modern .sky-summary-action-bar-summary-items ::ng-deep sky-key-info{margin:0 30px 10px 0;display:inline-block}.sky-theme-modern .sky-summary-action-bar-summary-items ::ng-deep sky-key-info:last-child{margin:0 0 10px}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-summary-action-bar{background-color:#000;box-shadow:none}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-summary-action-bar-actions{background-color:#000}.sky-theme-modern.sky-theme-mode-dark .sky-summary-action-bar{background-color:#000;box-shadow:none}.sky-theme-modern.sky-theme-mode-dark .sky-summary-action-bar-actions{background-color:#000}\n"] }]
|
|
501
532
|
}], ctorParameters: function () { return [{ type: SkySummaryActionBarAdapterService }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i2.SkyMediaQueryService }, { type: i2.SkyMutationObserverService }, { type: i2.SkyAppWindowRef }]; }, propDecorators: { summaryElement: [{
|
|
502
533
|
type: ContentChild,
|
|
503
534
|
args: [SkySummaryActionBarSummaryComponent, { read: ElementRef }]
|
|
@@ -508,9 +539,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImpor
|
|
|
508
539
|
|
|
509
540
|
class SkySummaryActionBarModule {
|
|
510
541
|
}
|
|
511
|
-
SkySummaryActionBarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.
|
|
512
|
-
SkySummaryActionBarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.
|
|
542
|
+
SkySummaryActionBarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
543
|
+
SkySummaryActionBarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarModule, declarations: [SkySummaryActionBarActionsComponent,
|
|
513
544
|
SkySummaryActionBarCancelComponent,
|
|
545
|
+
SkySummaryActionBarCollapsiblePipe,
|
|
514
546
|
SkySummaryActionBarComponent,
|
|
515
547
|
SkySummaryActionBarPrimaryActionComponent,
|
|
516
548
|
SkySummaryActionBarSecondaryActionComponent,
|
|
@@ -528,19 +560,20 @@ SkySummaryActionBarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0
|
|
|
528
560
|
SkySummaryActionBarSecondaryActionComponent,
|
|
529
561
|
SkySummaryActionBarSecondaryActionsComponent,
|
|
530
562
|
SkySummaryActionBarSummaryComponent] });
|
|
531
|
-
SkySummaryActionBarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.
|
|
563
|
+
SkySummaryActionBarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarModule, imports: [CommonModule,
|
|
532
564
|
SkyChevronModule,
|
|
533
565
|
SkyDropdownModule,
|
|
534
566
|
SkyI18nModule,
|
|
535
567
|
SkyIconModule,
|
|
536
568
|
SkyActionBarsResourcesModule,
|
|
537
569
|
SkyThemeModule] });
|
|
538
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.
|
|
570
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkySummaryActionBarModule, decorators: [{
|
|
539
571
|
type: NgModule,
|
|
540
572
|
args: [{
|
|
541
573
|
declarations: [
|
|
542
574
|
SkySummaryActionBarActionsComponent,
|
|
543
575
|
SkySummaryActionBarCancelComponent,
|
|
576
|
+
SkySummaryActionBarCollapsiblePipe,
|
|
544
577
|
SkySummaryActionBarComponent,
|
|
545
578
|
SkySummaryActionBarPrimaryActionComponent,
|
|
546
579
|
SkySummaryActionBarSecondaryActionComponent,
|