@skyux/action-bars 5.9.7 → 5.10.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.
@@ -309,6 +309,9 @@
309
309
  this.windowRef = windowRef;
310
310
  this.renderer = this.rendererFactory.createRenderer(undefined, undefined);
311
311
  }
312
+ SkySummaryActionBarAdapterService.prototype.focusChevron = function (chevronElement) {
313
+ chevronElement.nativeElement.querySelector('.sky-chevron').focus();
314
+ };
312
315
  SkySummaryActionBarAdapterService.prototype.styleBodyElementForActionBar = function (summaryActionBarRef) {
313
316
  var window = this.windowRef.nativeWindow;
314
317
  var body = window.document.body;
@@ -487,13 +490,22 @@
487
490
  this.summaryElement.nativeElement.children.length > 0);
488
491
  };
489
492
  // NOTE: This function is needed so that the button is not removed until post-animation
490
- SkySummaryActionBarComponent.prototype.summaryTransitionEnd = function () {
491
- if (this.slideDirection === 'up') {
492
- this.isSummaryCollapsed = true;
493
- }
494
- if (this.type === SkySummaryActionBarType.Page ||
495
- this.type === SkySummaryActionBarType.Tab) {
496
- this.adapterService.styleBodyElementForActionBar(this.elementRef);
493
+ SkySummaryActionBarComponent.prototype.summaryTransitionEnd = function (animationEvent) {
494
+ var _this = this;
495
+ if (animationEvent.toState !== 'void' &&
496
+ animationEvent.fromState !== 'void') {
497
+ if (this.slideDirection === 'up') {
498
+ this.isSummaryCollapsed = true;
499
+ this.changeDetector.markForCheck();
500
+ }
501
+ if (this.type === SkySummaryActionBarType.Page ||
502
+ this.type === SkySummaryActionBarType.Tab) {
503
+ this.adapterService.styleBodyElementForActionBar(this.elementRef);
504
+ }
505
+ // Ensure that the correct chevron is fully rendered prior to setting focus.
506
+ setTimeout(function () {
507
+ _this.adapterService.focusChevron(_this.chevronElementRef);
508
+ });
497
509
  }
498
510
  };
499
511
  // NOTE: This function is needed so that the button is added before animation
@@ -566,12 +578,12 @@
566
578
  return SkySummaryActionBarComponent;
567
579
  }());
568
580
  SkySummaryActionBarComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkySummaryActionBarComponent, deps: [{ token: SkySummaryActionBarAdapterService }, { token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.ElementRef }, { token: i2__namespace$1.SkyMediaQueryService }, { token: i2__namespace$1.MutationObserverService }, { token: i2__namespace$1.SkyAppWindowRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
569
- SkySummaryActionBarComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkySummaryActionBarComponent, selector: "sky-summary-action-bar", providers: [SkySummaryActionBarAdapterService], queries: [{ propertyName: "summaryELement", first: true, predicate: SkySummaryActionBarSummaryComponent, descendants: true, read: i0.ElementRef }], ngImport: i0__namespace, template: "<div\n class=\"sky-summary-action-bar\"\n [ngClass]=\"{\n 'sky-summary-action-bar-summary-collapsible': isSummaryCollapsible,\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()\"\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=\"isSummaryCollapsible && !isSummaryCollapsed\"\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=\"isSummaryCollapsible && isSummaryCollapsed\"\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 >\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{padding:20px}.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"], components: [{ type: i3__namespace$1.λ2, selector: "sky-chevron", inputs: ["ariaControls", "ariaLabel", "direction", "disabled"], outputs: ["directionChange"] }], directives: [{ type: i4__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3__namespace.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }], pipes: { "skyLibResources": i4__namespace$1.SkyLibResourcesPipe }, animations: [animations.skyAnimationSlide], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
581
+ SkySummaryActionBarComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkySummaryActionBarComponent, selector: "sky-summary-action-bar", providers: [SkySummaryActionBarAdapterService], queries: [{ propertyName: "summaryELement", first: true, predicate: SkySummaryActionBarSummaryComponent, descendants: true, read: i0.ElementRef }], viewQueries: [{ propertyName: "chevronElementRef", first: true, predicate: ["chevronEl"], descendants: true, read: i0.ElementRef }], ngImport: i0__namespace, template: "<div\n class=\"sky-summary-action-bar\"\n [ngClass]=\"{\n 'sky-summary-action-bar-summary-collapsible': isSummaryCollapsible,\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=\"isSummaryCollapsible && !isSummaryCollapsed\"\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=\"isSummaryCollapsible && isSummaryCollapsed\"\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{padding:20px}.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"], components: [{ type: i3__namespace$1.λ2, selector: "sky-chevron", inputs: ["ariaControls", "ariaLabel", "direction", "disabled"], outputs: ["directionChange"] }], directives: [{ type: i4__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3__namespace.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }], pipes: { "skyLibResources": i4__namespace$1.SkyLibResourcesPipe }, animations: [animations.skyAnimationSlide], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
570
582
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkySummaryActionBarComponent, decorators: [{
571
583
  type: i0.Component,
572
584
  args: [{
573
585
  selector: 'sky-summary-action-bar',
574
- template: "<div\n class=\"sky-summary-action-bar\"\n [ngClass]=\"{\n 'sky-summary-action-bar-summary-collapsible': isSummaryCollapsible,\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()\"\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=\"isSummaryCollapsible && !isSummaryCollapsed\"\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=\"isSummaryCollapsible && isSummaryCollapsed\"\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 >\n </sky-chevron>\n</ng-template>\n",
586
+ template: "<div\n class=\"sky-summary-action-bar\"\n [ngClass]=\"{\n 'sky-summary-action-bar-summary-collapsible': isSummaryCollapsible,\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=\"isSummaryCollapsible && !isSummaryCollapsed\"\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=\"isSummaryCollapsible && isSummaryCollapsed\"\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",
575
587
  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{padding:20px}.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"],
576
588
  animations: [animations.skyAnimationSlide],
577
589
  providers: [SkySummaryActionBarAdapterService],
@@ -580,6 +592,9 @@
580
592
  }], ctorParameters: function () { return [{ type: SkySummaryActionBarAdapterService }, { type: i0__namespace.ChangeDetectorRef }, { type: i0__namespace.ElementRef }, { type: i2__namespace$1.SkyMediaQueryService }, { type: i2__namespace$1.MutationObserverService }, { type: i2__namespace$1.SkyAppWindowRef }]; }, propDecorators: { summaryELement: [{
581
593
  type: i0.ContentChild,
582
594
  args: [SkySummaryActionBarSummaryComponent, { read: i0.ElementRef }]
595
+ }], chevronElementRef: [{
596
+ type: i0.ViewChild,
597
+ args: ['chevronEl', { read: i0.ElementRef }]
583
598
  }] } });
584
599
 
585
600
  var SkySummaryActionBarModule = /** @class */ (function () {