@skyux/layout 8.6.0 → 9.0.0-alpha.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.
Files changed (149) hide show
  1. package/esm2022/lib/modules/action-button/action-button-adapter-service.mjs +44 -0
  2. package/esm2022/lib/modules/action-button/action-button-container.component.mjs +138 -0
  3. package/{esm2020 → esm2022}/lib/modules/action-button/action-button-details.component.mjs +4 -4
  4. package/{esm2020 → esm2022}/lib/modules/action-button/action-button-header.component.mjs +4 -4
  5. package/esm2022/lib/modules/action-button/action-button-icon.component.mjs +40 -0
  6. package/esm2022/lib/modules/action-button/action-button.component.mjs +50 -0
  7. package/{esm2020 → esm2022}/lib/modules/action-button/action-button.module.mjs +23 -23
  8. package/{esm2020 → esm2022}/lib/modules/back-to-top/back-to-top-adapter.service.mjs +19 -22
  9. package/esm2022/lib/modules/back-to-top/back-to-top.component.mjs +25 -0
  10. package/esm2022/lib/modules/back-to-top/back-to-top.directive.mjs +119 -0
  11. package/{esm2020 → esm2022}/lib/modules/back-to-top/back-to-top.module.mjs +13 -13
  12. package/{esm2020 → esm2022}/lib/modules/box/box-content.component.mjs +4 -4
  13. package/{esm2020 → esm2022}/lib/modules/box/box-controls.component.mjs +4 -4
  14. package/{esm2020 → esm2022}/lib/modules/box/box-header.component.mjs +4 -4
  15. package/{esm2020 → esm2022}/lib/modules/box/box.component.mjs +4 -4
  16. package/{esm2020 → esm2022}/lib/modules/box/box.module.mjs +11 -11
  17. package/{esm2020 → esm2022}/lib/modules/card/card-actions.component.mjs +4 -4
  18. package/{esm2020 → esm2022}/lib/modules/card/card-content.component.mjs +4 -4
  19. package/{esm2020 → esm2022}/lib/modules/card/card-title.component.mjs +4 -4
  20. package/esm2022/lib/modules/card/card.component.mjs +107 -0
  21. package/{esm2020 → esm2022}/lib/modules/card/card.module.mjs +21 -21
  22. package/{esm2020 → esm2022}/lib/modules/definition-list/definition-list-content.component.mjs +4 -4
  23. package/{esm2020 → esm2022}/lib/modules/definition-list/definition-list-heading.component.mjs +4 -4
  24. package/{esm2020 → esm2022}/lib/modules/definition-list/definition-list-label.component.mjs +4 -4
  25. package/{esm2020 → esm2022}/lib/modules/definition-list/definition-list-value.component.mjs +4 -4
  26. package/{esm2020 → esm2022}/lib/modules/definition-list/definition-list.component.mjs +4 -4
  27. package/{esm2020 → esm2022}/lib/modules/definition-list/definition-list.module.mjs +13 -13
  28. package/{esm2020 → esm2022}/lib/modules/definition-list/definition-list.service.mjs +4 -4
  29. package/esm2022/lib/modules/description-list/description-list-adapter-service.mjs +44 -0
  30. package/{esm2020 → esm2022}/lib/modules/description-list/description-list-content.component.mjs +4 -4
  31. package/esm2022/lib/modules/description-list/description-list-description.component.mjs +52 -0
  32. package/{esm2020 → esm2022}/lib/modules/description-list/description-list-term.component.mjs +4 -4
  33. package/esm2022/lib/modules/description-list/description-list.component.mjs +95 -0
  34. package/{esm2020 → esm2022}/lib/modules/description-list/description-list.module.mjs +19 -19
  35. package/esm2022/lib/modules/description-list/description-list.service.mjs +24 -0
  36. package/esm2022/lib/modules/fluid-grid/column.component.mjs +66 -0
  37. package/esm2022/lib/modules/fluid-grid/fluid-grid.component.mjs +40 -0
  38. package/{esm2020 → esm2022}/lib/modules/fluid-grid/fluid-grid.module.mjs +5 -5
  39. package/{esm2020 → esm2022}/lib/modules/fluid-grid/row.component.mjs +4 -4
  40. package/esm2022/lib/modules/format/format.component.mjs +64 -0
  41. package/{esm2020 → esm2022}/lib/modules/format/format.module.mjs +5 -5
  42. package/esm2022/lib/modules/inline-delete/inline-delete-adapter.service.mjs +123 -0
  43. package/esm2022/lib/modules/inline-delete/inline-delete.component.mjs +164 -0
  44. package/{esm2020 → esm2022}/lib/modules/inline-delete/inline-delete.module.mjs +11 -11
  45. package/esm2022/lib/modules/page/page-theme-adapter.service.mjs +40 -0
  46. package/esm2022/lib/modules/page/page.component.mjs +49 -0
  47. package/{esm2020 → esm2022}/lib/modules/page/page.module.mjs +5 -5
  48. package/{esm2020 → esm2022}/lib/modules/page-summary/page-summary-adapter.service.mjs +4 -4
  49. package/{esm2020 → esm2022}/lib/modules/page-summary/page-summary-alert.component.mjs +4 -4
  50. package/{esm2020 → esm2022}/lib/modules/page-summary/page-summary-content.component.mjs +4 -4
  51. package/{esm2020 → esm2022}/lib/modules/page-summary/page-summary-image.component.mjs +4 -4
  52. package/{esm2020 → esm2022}/lib/modules/page-summary/page-summary-key-info.component.mjs +4 -4
  53. package/{esm2020 → esm2022}/lib/modules/page-summary/page-summary-status.component.mjs +4 -4
  54. package/{esm2020 → esm2022}/lib/modules/page-summary/page-summary-subtitle.component.mjs +4 -4
  55. package/{esm2020 → esm2022}/lib/modules/page-summary/page-summary-title.component.mjs +4 -4
  56. package/esm2022/lib/modules/page-summary/page-summary.component.mjs +73 -0
  57. package/{esm2020 → esm2022}/lib/modules/page-summary/page-summary.module.mjs +19 -19
  58. package/esm2022/lib/modules/shared/sky-layout-resources.module.mjs +60 -0
  59. package/esm2022/lib/modules/text-expand/text-expand-adapter.service.mjs +26 -0
  60. package/{esm2020 → esm2022}/lib/modules/text-expand/text-expand-modal.component.mjs +4 -4
  61. package/esm2022/lib/modules/text-expand/text-expand.component.mjs +315 -0
  62. package/{esm2020 → esm2022}/lib/modules/text-expand/text-expand.module.mjs +11 -11
  63. package/esm2022/lib/modules/text-expand-repeater/text-expand-repeater-adapter.service.mjs +32 -0
  64. package/esm2022/lib/modules/text-expand-repeater/text-expand-repeater.component.mjs +216 -0
  65. package/{esm2020 → esm2022}/lib/modules/text-expand-repeater/text-expand-repeater.module.mjs +5 -5
  66. package/{esm2020 → esm2022}/lib/modules/toolbar/toolbar-item.component.mjs +4 -4
  67. package/{esm2020 → esm2022}/lib/modules/toolbar/toolbar-section.component.mjs +4 -4
  68. package/{esm2020 → esm2022}/lib/modules/toolbar/toolbar-view-actions.component.mjs +4 -4
  69. package/{esm2020 → esm2022}/lib/modules/toolbar/toolbar.component.mjs +4 -4
  70. package/{esm2020 → esm2022}/lib/modules/toolbar/toolbar.module.mjs +11 -11
  71. package/esm2022/testing/action-button-fixture.mjs +48 -0
  72. package/esm2022/testing/box/box-harness.mjs +34 -0
  73. package/esm2022/testing/card-fixture.mjs +65 -0
  74. package/esm2022/testing/page-summary-fixture.mjs +31 -0
  75. package/fesm2022/skyux-layout-testing.mjs +181 -0
  76. package/{fesm2015 → fesm2022}/skyux-layout-testing.mjs.map +1 -1
  77. package/fesm2022/skyux-layout.mjs +2957 -0
  78. package/{fesm2020 → fesm2022}/skyux-layout.mjs.map +1 -1
  79. package/lib/modules/action-button/action-button-container.component.d.ts +1 -1
  80. package/lib/modules/action-button/action-button-icon.component.d.ts +1 -1
  81. package/lib/modules/action-button/action-button.component.d.ts +1 -1
  82. package/lib/modules/back-to-top/back-to-top.directive.d.ts +1 -1
  83. package/lib/modules/box/box.component.d.ts +1 -1
  84. package/lib/modules/card/card.component.d.ts +1 -1
  85. package/lib/modules/definition-list/definition-list.component.d.ts +1 -1
  86. package/lib/modules/description-list/description-list.component.d.ts +1 -1
  87. package/lib/modules/fluid-grid/column.component.d.ts +1 -1
  88. package/lib/modules/fluid-grid/fluid-grid.component.d.ts +1 -1
  89. package/lib/modules/fluid-grid/row.component.d.ts +1 -1
  90. package/lib/modules/format/format.component.d.ts +1 -1
  91. package/lib/modules/inline-delete/inline-delete.component.d.ts +1 -1
  92. package/lib/modules/page/page.component.d.ts +1 -1
  93. package/lib/modules/text-expand/text-expand.component.d.ts +1 -1
  94. package/lib/modules/text-expand-repeater/text-expand-repeater.component.d.ts +1 -1
  95. package/package.json +23 -31
  96. package/esm2020/lib/modules/action-button/action-button-adapter-service.mjs +0 -47
  97. package/esm2020/lib/modules/action-button/action-button-container.component.mjs +0 -139
  98. package/esm2020/lib/modules/action-button/action-button-icon.component.mjs +0 -43
  99. package/esm2020/lib/modules/action-button/action-button.component.mjs +0 -53
  100. package/esm2020/lib/modules/back-to-top/back-to-top.component.mjs +0 -30
  101. package/esm2020/lib/modules/back-to-top/back-to-top.directive.mjs +0 -118
  102. package/esm2020/lib/modules/card/card.component.mjs +0 -109
  103. package/esm2020/lib/modules/description-list/description-list-adapter-service.mjs +0 -47
  104. package/esm2020/lib/modules/description-list/description-list-description.component.mjs +0 -55
  105. package/esm2020/lib/modules/description-list/description-list.component.mjs +0 -98
  106. package/esm2020/lib/modules/description-list/description-list.service.mjs +0 -29
  107. package/esm2020/lib/modules/fluid-grid/column.component.mjs +0 -71
  108. package/esm2020/lib/modules/fluid-grid/fluid-grid.component.mjs +0 -42
  109. package/esm2020/lib/modules/format/format.component.mjs +0 -67
  110. package/esm2020/lib/modules/inline-delete/inline-delete-adapter.service.mjs +0 -122
  111. package/esm2020/lib/modules/inline-delete/inline-delete.component.mjs +0 -167
  112. package/esm2020/lib/modules/page/page-theme-adapter.service.mjs +0 -43
  113. package/esm2020/lib/modules/page/page.component.mjs +0 -52
  114. package/esm2020/lib/modules/page-summary/page-summary.component.mjs +0 -75
  115. package/esm2020/lib/modules/shared/sky-layout-resources.module.mjs +0 -60
  116. package/esm2020/lib/modules/text-expand/text-expand-adapter.service.mjs +0 -29
  117. package/esm2020/lib/modules/text-expand/text-expand.component.mjs +0 -306
  118. package/esm2020/lib/modules/text-expand-repeater/text-expand-repeater-adapter.service.mjs +0 -35
  119. package/esm2020/lib/modules/text-expand-repeater/text-expand-repeater.component.mjs +0 -214
  120. package/esm2020/testing/action-button-fixture.mjs +0 -51
  121. package/esm2020/testing/box/box-harness.mjs +0 -40
  122. package/esm2020/testing/card-fixture.mjs +0 -67
  123. package/esm2020/testing/page-summary-fixture.mjs +0 -34
  124. package/fesm2015/skyux-layout-testing.mjs +0 -198
  125. package/fesm2015/skyux-layout.mjs +0 -2996
  126. package/fesm2015/skyux-layout.mjs.map +0 -1
  127. package/fesm2020/skyux-layout-testing.mjs +0 -192
  128. package/fesm2020/skyux-layout-testing.mjs.map +0 -1
  129. package/fesm2020/skyux-layout.mjs +0 -2982
  130. /package/{esm2020 → esm2022}/index.mjs +0 -0
  131. /package/{esm2020 → esm2022}/lib/modules/action-button/action-button-permalink.mjs +0 -0
  132. /package/{esm2020 → esm2022}/lib/modules/action-button/types/action-button-container-align-items-type.mjs +0 -0
  133. /package/{esm2020 → esm2022}/lib/modules/action-button/types/action-button-container-align-items.mjs +0 -0
  134. /package/{esm2020 → esm2022}/lib/modules/back-to-top/models/back-to-top-message-type.mjs +0 -0
  135. /package/{esm2020 → esm2022}/lib/modules/back-to-top/models/back-to-top-message.mjs +0 -0
  136. /package/{esm2020 → esm2022}/lib/modules/back-to-top/models/back-to-top-options.mjs +0 -0
  137. /package/{esm2020 → esm2022}/lib/modules/description-list/types/description-list-mode-type.mjs +0 -0
  138. /package/{esm2020 → esm2022}/lib/modules/description-list/types/description-list-mode.mjs +0 -0
  139. /package/{esm2020 → esm2022}/lib/modules/fluid-grid/types/fluid-grid-gutter-size-type.mjs +0 -0
  140. /package/{esm2020 → esm2022}/lib/modules/format/format-item.mjs +0 -0
  141. /package/{esm2020 → esm2022}/lib/modules/inline-delete/inline-delete-type.mjs +0 -0
  142. /package/{esm2020 → esm2022}/lib/modules/page/page-layout-type.mjs +0 -0
  143. /package/{esm2020 → esm2022}/lib/modules/text-expand/text-expand-modal-context-token.mjs +0 -0
  144. /package/{esm2020 → esm2022}/lib/modules/text-expand/text-expand-modal-context.mjs +0 -0
  145. /package/{esm2020 → esm2022}/lib/modules/text-expand-repeater/types/text-expand-repeater-list-style-type.mjs +0 -0
  146. /package/{esm2020 → esm2022}/skyux-layout.mjs +0 -0
  147. /package/{esm2020 → esm2022}/testing/box/box-harness.filters.mjs +0 -0
  148. /package/{esm2020 → esm2022}/testing/public-api.mjs +0 -0
  149. /package/{esm2020 → esm2022}/testing/skyux-layout-testing.mjs +0 -0
@@ -1,2982 +0,0 @@
1
- import * as i5 from '@angular/cdk/observers';
2
- import { ObserversModule } from '@angular/cdk/observers';
3
- import * as i1 from '@angular/common';
4
- import { CommonModule, DOCUMENT } from '@angular/common';
5
- import * as i0 from '@angular/core';
6
- import { Injectable, EventEmitter, Component, ViewEncapsulation, SkipSelf, HostBinding, Input, Output, ElementRef, Optional, ContentChildren, ViewChild, HostListener, NgModule, ChangeDetectionStrategy, Directive, TemplateRef, Inject, inject, InjectionToken } from '@angular/core';
7
- import * as i2 from '@angular/router';
8
- import { RouterModule } from '@angular/router';
9
- import * as i2$1 from '@skyux/indicators';
10
- import { SkyIconModule, SkyWaitModule } from '@skyux/indicators';
11
- import * as i3 from '@skyux/router';
12
- import { SkyHrefModule } from '@skyux/router';
13
- import * as i1$1 from '@skyux/theme';
14
- import { SkyThemeModule } from '@skyux/theme';
15
- import { __classPrivateFieldSet, __classPrivateFieldGet } from 'tslib';
16
- import { Subject, BehaviorSubject, forkJoin } from 'rxjs';
17
- import { takeUntil, take } from 'rxjs/operators';
18
- import * as i1$2 from '@skyux/core';
19
- import { SkyMediaBreakpoints, SkyDockModule, SkyTrimModule, SkyCoreAdapterService, SkyLogService } from '@skyux/core';
20
- import * as i1$3 from '@skyux/i18n';
21
- import { getLibStringForLocale, SkyI18nModule, SKY_LIB_RESOURCES_PROVIDERS } from '@skyux/i18n';
22
- import * as i3$1 from '@angular/forms';
23
- import { FormsModule } from '@angular/forms';
24
- import * as i4 from '@skyux/forms';
25
- import { SkyCheckboxModule } from '@skyux/forms';
26
- import { trigger, transition, style, query, group, animate, state } from '@angular/animations';
27
- import * as i1$4 from '@skyux/modals';
28
- import { SkyModalModule } from '@skyux/modals';
29
-
30
- var _SkyActionButtonAdapterService_instances, _SkyActionButtonAdapterService_renderer, _SkyActionButtonAdapterService_getResponsiveClassName;
31
- const RESPONSIVE_CLASS_SM = 'sky-action-button-container-sm';
32
- const RESPONSIVE_CLASS_MD = 'sky-action-button-container-md';
33
- const RESPONSIVE_CLASS_LG = 'sky-action-button-container-lg';
34
- const BREAKPOINT_MD = 912;
35
- const BREAKPOINT_LG = 1378;
36
- /**
37
- * @internal
38
- */
39
- class SkyActionButtonAdapterService {
40
- constructor(rendererFactory) {
41
- _SkyActionButtonAdapterService_instances.add(this);
42
- _SkyActionButtonAdapterService_renderer.set(this, void 0);
43
- __classPrivateFieldSet(this, _SkyActionButtonAdapterService_renderer, rendererFactory.createRenderer(undefined, null), "f");
44
- }
45
- getParentWidth(element) {
46
- return element.nativeElement.parentElement?.getBoundingClientRect().width;
47
- }
48
- setResponsiveClass(element, width = 0) {
49
- const el = element.nativeElement;
50
- const className = __classPrivateFieldGet(this, _SkyActionButtonAdapterService_instances, "m", _SkyActionButtonAdapterService_getResponsiveClassName).call(this, width);
51
- __classPrivateFieldGet(this, _SkyActionButtonAdapterService_renderer, "f").removeClass(el, RESPONSIVE_CLASS_SM);
52
- __classPrivateFieldGet(this, _SkyActionButtonAdapterService_renderer, "f").removeClass(el, RESPONSIVE_CLASS_MD);
53
- __classPrivateFieldGet(this, _SkyActionButtonAdapterService_renderer, "f").removeClass(el, RESPONSIVE_CLASS_LG);
54
- __classPrivateFieldGet(this, _SkyActionButtonAdapterService_renderer, "f").addClass(el, className);
55
- }
56
- }
57
- _SkyActionButtonAdapterService_renderer = new WeakMap(), _SkyActionButtonAdapterService_instances = new WeakSet(), _SkyActionButtonAdapterService_getResponsiveClassName = function _SkyActionButtonAdapterService_getResponsiveClassName(width) {
58
- if (width < BREAKPOINT_MD) {
59
- return RESPONSIVE_CLASS_SM;
60
- }
61
- else if (width >= BREAKPOINT_MD && width < BREAKPOINT_LG) {
62
- return RESPONSIVE_CLASS_MD;
63
- }
64
- else {
65
- return RESPONSIVE_CLASS_LG;
66
- }
67
- };
68
- SkyActionButtonAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonAdapterService, deps: [{ token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
69
- SkyActionButtonAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonAdapterService });
70
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonAdapterService, decorators: [{
71
- type: Injectable
72
- }], ctorParameters: function () { return [{ type: i0.RendererFactory2 }]; } });
73
-
74
- var _SkyActionButtonComponent_changeDetector;
75
- /**
76
- * Creates a button to present users with an option to move forward with tasks.
77
- */
78
- class SkyActionButtonComponent {
79
- constructor(changeDetector) {
80
- this.hidden = false;
81
- /**
82
- * Fires when users select the action button.
83
- */
84
- this.actionClick = new EventEmitter();
85
- _SkyActionButtonComponent_changeDetector.set(this, void 0);
86
- __classPrivateFieldSet(this, _SkyActionButtonComponent_changeDetector, changeDetector, "f");
87
- }
88
- buttonClicked() {
89
- this.actionClick.emit();
90
- }
91
- enterPress() {
92
- this.actionClick.emit();
93
- }
94
- onSkyHrefDisplayChange($event) {
95
- if (this.hidden === $event.userHasAccess) {
96
- setTimeout(() => {
97
- this.hidden = !$event.userHasAccess;
98
- __classPrivateFieldGet(this, _SkyActionButtonComponent_changeDetector, "f").markForCheck();
99
- });
100
- }
101
- }
102
- }
103
- _SkyActionButtonComponent_changeDetector = new WeakMap();
104
- SkyActionButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonComponent, deps: [{ token: i0.ChangeDetectorRef, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
105
- SkyActionButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyActionButtonComponent, selector: "sky-action-button", inputs: { permalink: "permalink" }, outputs: { actionClick: "actionClick" }, host: { properties: { "hidden": "this.hidden" } }, ngImport: i0, template: "<ng-container [ngSwitch]=\"true\">\n <a\n *ngSwitchCase=\"!!permalink?.route?.commands\"\n class=\"sky-action-button sky-btn-default sky-rounded-corners\"\n tabindex=\"0\"\n [fragment]=\"permalink?.route?.extras?.fragment\"\n [skyThemeClass]=\"{\n 'sky-btn sky-box': 'modern'\n }\"\n [queryParams]=\"permalink?.route?.extras?.queryParams\"\n [queryParamsHandling]=\"permalink?.route?.extras?.queryParamsHandling\"\n [routerLink]=\"permalink?.route?.commands\"\n >\n <ng-container *ngTemplateOutlet=\"actionButtonContent\"></ng-container>\n </a>\n\n <a\n *ngSwitchCase=\"\n !permalink?.route &&\n permalink?.url &&\n (!permalink?.url?.includes('://') ||\n permalink?.url?.startsWith('https://'))\n \"\n class=\"sky-action-button sky-btn-default sky-rounded-corners\"\n tabindex=\"0\"\n [href]=\"permalink?.url\"\n [skyThemeClass]=\"{\n 'sky-btn sky-box': 'modern'\n }\"\n >\n <ng-container *ngTemplateOutlet=\"actionButtonContent\"></ng-container>\n </a>\n\n <a\n *ngSwitchCase=\"\n !permalink?.route &&\n permalink?.url &&\n permalink?.url?.includes('://') &&\n !permalink?.url?.startsWith('https://')\n \"\n class=\"sky-action-button sky-btn-default sky-rounded-corners\"\n tabindex=\"0\"\n [skyHref]=\"permalink?.url\"\n (skyHrefChange)=\"onSkyHrefDisplayChange($event)\"\n [skyThemeClass]=\"{\n 'sky-btn sky-box': 'modern'\n }\"\n >\n <ng-container *ngTemplateOutlet=\"actionButtonContent\"></ng-container>\n </a>\n\n <div\n *ngSwitchDefault\n class=\"sky-action-button sky-btn-default sky-rounded-corners\"\n tabindex=\"0\"\n role=\"button\"\n [skyThemeClass]=\"{\n 'sky-btn sky-box': 'modern'\n }\"\n (click)=\"buttonClicked()\"\n (keydown.enter)=\"enterPress()\"\n >\n <ng-container *ngTemplateOutlet=\"actionButtonContent\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #actionButtonContent>\n <ng-container *skyThemeIf=\"'default'\">\n <div class=\"sky-action-button-icon-header-container\">\n <ng-container *ngTemplateOutlet=\"icon\"></ng-container>\n <ng-container *ngTemplateOutlet=\"header\"></ng-container>\n </div>\n <ng-container *ngTemplateOutlet=\"details\"></ng-container>\n </ng-container>\n\n <ng-container *skyThemeIf=\"'modern'\">\n <ng-container *ngTemplateOutlet=\"icon\"></ng-container>\n <div class=\"sky-action-button-content\">\n <ng-container *ngTemplateOutlet=\"header\"></ng-container>\n <div\n class=\"sky-action-button-details\"\n [skyThemeClass]=\"{\n 'sky-font-deemphasized': 'modern'\n }\"\n >\n <ng-container *ngTemplateOutlet=\"details\"></ng-container>\n </div>\n </div>\n </ng-container>\n</ng-template>\n\n<ng-template #icon>\n <ng-content select=\"sky-action-button-icon\"></ng-content>\n</ng-template>\n\n<ng-template #header>\n <ng-content select=\"sky-action-button-header\"></ng-content>\n</ng-template>\n\n<ng-template #details>\n <ng-content select=\"sky-action-button-details\"></ng-content>\n</ng-template>\n", styles: [".sky-action-button{border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;border-right:1px solid #cdcfd2;cursor:pointer;text-align:center;text-decoration:none!important;display:block}.sky-action-button:hover{border-color:#c2c4c6}.sky-action-button-icon-header-container{display:flex;justify-content:center}.sky-action-button{padding:20px 20px 30px;margin:0 15px}.sky-action-button-icon-header-container{margin-bottom:20px}.sky-responsive-container-xs .sky-action-button,.sky-responsive-container-sm .sky-action-button,.sky-responsive-container-md .sky-action-button,.sky-responsive-container-lg .sky-action-button{padding:20px 20px 30px;margin:0 15px}.sky-responsive-container-xs .sky-action-button-icon-header-container,.sky-responsive-container-sm .sky-action-button-icon-header-container,.sky-responsive-container-md .sky-action-button-icon-header-container,.sky-responsive-container-lg .sky-action-button-icon-header-container{margin-bottom:20px}@media (min-width: 768px){.sky-action-button{padding:30px 20px;margin:0;max-width:236px}.sky-action-button-icon-header-container{margin-bottom:0;flex-direction:column}}.sky-responsive-container-sm .sky-action-button,.sky-responsive-container-md .sky-action-button,.sky-responsive-container-lg .sky-action-button{padding:30px 20px;margin:0;max-width:236px}.sky-responsive-container-sm .sky-action-button-icon-header-container,.sky-responsive-container-md .sky-action-button-icon-header-container,.sky-responsive-container-lg .sky-action-button-icon-header-container{margin-bottom:0;flex-direction:column}.sky-theme-modern .sky-action-button{display:flex;flex-flow:row nowrap;padding:30px;text-align:left;border:none}.sky-theme-modern .sky-action-button .sky-action-button-content{flex:1 1 auto;margin:0 10px 0 0;white-space:initial}.sky-theme-modern .sky-action-button,.sky-theme-modern .sky-responsive-container-xs .sky-action-button,.sky-theme-modern .sky-responsive-container-sm .sky-action-button,.sky-theme-modern .sky-responsive-container-md .sky-action-button,.sky-theme-modern .sky-responsive-container-lg .sky-action-button{padding:30px;margin:0;max-width:446px}@media (min-width: 768px){.sky-theme-modern .sky-action-button{padding:30px;margin:0}}.sky-theme-modern .sky-responsive-container-sm .sky-action-button,.sky-theme-modern .sky-responsive-container-md .sky-action-button,.sky-theme-modern .sky-responsive-container-lg .sky-action-button{padding:30px;margin:0}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.λ1, selector: "[skyHref]", inputs: ["skyHref", "skyHrefElse"], outputs: ["skyHrefChange"] }, { kind: "directive", type: i1$1.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "directive", type: i1$1.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }], encapsulation: i0.ViewEncapsulation.None });
106
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonComponent, decorators: [{
107
- type: Component,
108
- args: [{ selector: 'sky-action-button', encapsulation: ViewEncapsulation.None, template: "<ng-container [ngSwitch]=\"true\">\n <a\n *ngSwitchCase=\"!!permalink?.route?.commands\"\n class=\"sky-action-button sky-btn-default sky-rounded-corners\"\n tabindex=\"0\"\n [fragment]=\"permalink?.route?.extras?.fragment\"\n [skyThemeClass]=\"{\n 'sky-btn sky-box': 'modern'\n }\"\n [queryParams]=\"permalink?.route?.extras?.queryParams\"\n [queryParamsHandling]=\"permalink?.route?.extras?.queryParamsHandling\"\n [routerLink]=\"permalink?.route?.commands\"\n >\n <ng-container *ngTemplateOutlet=\"actionButtonContent\"></ng-container>\n </a>\n\n <a\n *ngSwitchCase=\"\n !permalink?.route &&\n permalink?.url &&\n (!permalink?.url?.includes('://') ||\n permalink?.url?.startsWith('https://'))\n \"\n class=\"sky-action-button sky-btn-default sky-rounded-corners\"\n tabindex=\"0\"\n [href]=\"permalink?.url\"\n [skyThemeClass]=\"{\n 'sky-btn sky-box': 'modern'\n }\"\n >\n <ng-container *ngTemplateOutlet=\"actionButtonContent\"></ng-container>\n </a>\n\n <a\n *ngSwitchCase=\"\n !permalink?.route &&\n permalink?.url &&\n permalink?.url?.includes('://') &&\n !permalink?.url?.startsWith('https://')\n \"\n class=\"sky-action-button sky-btn-default sky-rounded-corners\"\n tabindex=\"0\"\n [skyHref]=\"permalink?.url\"\n (skyHrefChange)=\"onSkyHrefDisplayChange($event)\"\n [skyThemeClass]=\"{\n 'sky-btn sky-box': 'modern'\n }\"\n >\n <ng-container *ngTemplateOutlet=\"actionButtonContent\"></ng-container>\n </a>\n\n <div\n *ngSwitchDefault\n class=\"sky-action-button sky-btn-default sky-rounded-corners\"\n tabindex=\"0\"\n role=\"button\"\n [skyThemeClass]=\"{\n 'sky-btn sky-box': 'modern'\n }\"\n (click)=\"buttonClicked()\"\n (keydown.enter)=\"enterPress()\"\n >\n <ng-container *ngTemplateOutlet=\"actionButtonContent\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #actionButtonContent>\n <ng-container *skyThemeIf=\"'default'\">\n <div class=\"sky-action-button-icon-header-container\">\n <ng-container *ngTemplateOutlet=\"icon\"></ng-container>\n <ng-container *ngTemplateOutlet=\"header\"></ng-container>\n </div>\n <ng-container *ngTemplateOutlet=\"details\"></ng-container>\n </ng-container>\n\n <ng-container *skyThemeIf=\"'modern'\">\n <ng-container *ngTemplateOutlet=\"icon\"></ng-container>\n <div class=\"sky-action-button-content\">\n <ng-container *ngTemplateOutlet=\"header\"></ng-container>\n <div\n class=\"sky-action-button-details\"\n [skyThemeClass]=\"{\n 'sky-font-deemphasized': 'modern'\n }\"\n >\n <ng-container *ngTemplateOutlet=\"details\"></ng-container>\n </div>\n </div>\n </ng-container>\n</ng-template>\n\n<ng-template #icon>\n <ng-content select=\"sky-action-button-icon\"></ng-content>\n</ng-template>\n\n<ng-template #header>\n <ng-content select=\"sky-action-button-header\"></ng-content>\n</ng-template>\n\n<ng-template #details>\n <ng-content select=\"sky-action-button-details\"></ng-content>\n</ng-template>\n", styles: [".sky-action-button{border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;border-right:1px solid #cdcfd2;cursor:pointer;text-align:center;text-decoration:none!important;display:block}.sky-action-button:hover{border-color:#c2c4c6}.sky-action-button-icon-header-container{display:flex;justify-content:center}.sky-action-button{padding:20px 20px 30px;margin:0 15px}.sky-action-button-icon-header-container{margin-bottom:20px}.sky-responsive-container-xs .sky-action-button,.sky-responsive-container-sm .sky-action-button,.sky-responsive-container-md .sky-action-button,.sky-responsive-container-lg .sky-action-button{padding:20px 20px 30px;margin:0 15px}.sky-responsive-container-xs .sky-action-button-icon-header-container,.sky-responsive-container-sm .sky-action-button-icon-header-container,.sky-responsive-container-md .sky-action-button-icon-header-container,.sky-responsive-container-lg .sky-action-button-icon-header-container{margin-bottom:20px}@media (min-width: 768px){.sky-action-button{padding:30px 20px;margin:0;max-width:236px}.sky-action-button-icon-header-container{margin-bottom:0;flex-direction:column}}.sky-responsive-container-sm .sky-action-button,.sky-responsive-container-md .sky-action-button,.sky-responsive-container-lg .sky-action-button{padding:30px 20px;margin:0;max-width:236px}.sky-responsive-container-sm .sky-action-button-icon-header-container,.sky-responsive-container-md .sky-action-button-icon-header-container,.sky-responsive-container-lg .sky-action-button-icon-header-container{margin-bottom:0;flex-direction:column}.sky-theme-modern .sky-action-button{display:flex;flex-flow:row nowrap;padding:30px;text-align:left;border:none}.sky-theme-modern .sky-action-button .sky-action-button-content{flex:1 1 auto;margin:0 10px 0 0;white-space:initial}.sky-theme-modern .sky-action-button,.sky-theme-modern .sky-responsive-container-xs .sky-action-button,.sky-theme-modern .sky-responsive-container-sm .sky-action-button,.sky-theme-modern .sky-responsive-container-md .sky-action-button,.sky-theme-modern .sky-responsive-container-lg .sky-action-button{padding:30px;margin:0;max-width:446px}@media (min-width: 768px){.sky-theme-modern .sky-action-button{padding:30px;margin:0}}.sky-theme-modern .sky-responsive-container-sm .sky-action-button,.sky-theme-modern .sky-responsive-container-md .sky-action-button,.sky-theme-modern .sky-responsive-container-lg .sky-action-button{padding:30px;margin:0}\n"] }]
109
- }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef, decorators: [{
110
- type: SkipSelf
111
- }] }]; }, propDecorators: { hidden: [{
112
- type: HostBinding,
113
- args: ['hidden']
114
- }], permalink: [{
115
- type: Input
116
- }], actionClick: [{
117
- type: Output
118
- }] } });
119
-
120
- var _SkyActionButtonContainerComponent_instances, _SkyActionButtonContainerComponent_ngUnsubscribe, _SkyActionButtonContainerComponent_syncMaxHeightTimeout, _SkyActionButtonContainerComponent_themeName_set, _SkyActionButtonContainerComponent__alignItems, _SkyActionButtonContainerComponent__themeName, _SkyActionButtonContainerComponent_viewInitialized, _SkyActionButtonContainerComponent_actionButtonAdapterService, _SkyActionButtonContainerComponent_changeDetector, _SkyActionButtonContainerComponent_coreAdapterService, _SkyActionButtonContainerComponent_hostElRef, _SkyActionButtonContainerComponent_themeSvc, _SkyActionButtonContainerComponent_updateHeight, _SkyActionButtonContainerComponent_updateResponsiveClass;
121
- /**
122
- * Wraps action buttons to ensures that they have consistent height and spacing.
123
- * @required
124
- */
125
- class SkyActionButtonContainerComponent {
126
- /**
127
- * How to display the action buttons inside the action button container.
128
- * Options are `"center"` or `"left"`.
129
- * @default "center"
130
- */
131
- set alignItems(value) {
132
- __classPrivateFieldSet(this, _SkyActionButtonContainerComponent__alignItems, value ?? 'center', "f");
133
- }
134
- get alignItems() {
135
- return __classPrivateFieldGet(this, _SkyActionButtonContainerComponent__alignItems, "f");
136
- }
137
- constructor(actionButtonAdapterService, changeDetector, coreAdapterService, hostElRef, themeSvc) {
138
- _SkyActionButtonContainerComponent_instances.add(this);
139
- _SkyActionButtonContainerComponent_ngUnsubscribe.set(this, new Subject());
140
- _SkyActionButtonContainerComponent_syncMaxHeightTimeout.set(this, void 0);
141
- _SkyActionButtonContainerComponent__alignItems.set(this, 'center');
142
- _SkyActionButtonContainerComponent__themeName.set(this, void 0);
143
- _SkyActionButtonContainerComponent_viewInitialized.set(this, false);
144
- _SkyActionButtonContainerComponent_actionButtonAdapterService.set(this, void 0);
145
- _SkyActionButtonContainerComponent_changeDetector.set(this, void 0);
146
- _SkyActionButtonContainerComponent_coreAdapterService.set(this, void 0);
147
- _SkyActionButtonContainerComponent_hostElRef.set(this, void 0);
148
- _SkyActionButtonContainerComponent_themeSvc.set(this, void 0);
149
- __classPrivateFieldSet(this, _SkyActionButtonContainerComponent_actionButtonAdapterService, actionButtonAdapterService, "f");
150
- __classPrivateFieldSet(this, _SkyActionButtonContainerComponent_changeDetector, changeDetector, "f");
151
- __classPrivateFieldSet(this, _SkyActionButtonContainerComponent_coreAdapterService, coreAdapterService, "f");
152
- __classPrivateFieldSet(this, _SkyActionButtonContainerComponent_hostElRef, hostElRef, "f");
153
- __classPrivateFieldSet(this, _SkyActionButtonContainerComponent_themeSvc, themeSvc, "f");
154
- }
155
- ngOnInit() {
156
- /* istanbul ignore else */
157
- if (__classPrivateFieldGet(this, _SkyActionButtonContainerComponent_themeSvc, "f")) {
158
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_themeSvc, "f").settingsChange
159
- .pipe(takeUntil(__classPrivateFieldGet(this, _SkyActionButtonContainerComponent_ngUnsubscribe, "f")))
160
- .subscribe((themeSettings) => {
161
- __classPrivateFieldSet(this, _SkyActionButtonContainerComponent_instances, themeSettings.currentSettings.theme.name, "a", _SkyActionButtonContainerComponent_themeName_set);
162
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_changeDetector, "f").markForCheck();
163
- });
164
- }
165
- // Wait for children components to complete rendering before container width is determined.
166
- setTimeout(() => {
167
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_instances, "m", _SkyActionButtonContainerComponent_updateResponsiveClass).call(this);
168
- });
169
- }
170
- ngAfterViewInit() {
171
- // Watch for dynamic action button changes and recalculate height.
172
- /* istanbul ignore else */
173
- if (this.actionButtons) {
174
- this.actionButtons.changes
175
- .pipe(takeUntil(__classPrivateFieldGet(this, _SkyActionButtonContainerComponent_ngUnsubscribe, "f")))
176
- .subscribe(() => {
177
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_instances, "m", _SkyActionButtonContainerComponent_updateHeight).call(this);
178
- });
179
- }
180
- __classPrivateFieldSet(this, _SkyActionButtonContainerComponent_viewInitialized, true, "f");
181
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_instances, "m", _SkyActionButtonContainerComponent_updateHeight).call(this);
182
- }
183
- ngOnDestroy() {
184
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_ngUnsubscribe, "f").next();
185
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_ngUnsubscribe, "f").complete();
186
- }
187
- onContentChange() {
188
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_instances, "m", _SkyActionButtonContainerComponent_updateHeight).call(this);
189
- }
190
- onWindowResize() {
191
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_instances, "m", _SkyActionButtonContainerComponent_updateResponsiveClass).call(this);
192
- }
193
- }
194
- _SkyActionButtonContainerComponent_ngUnsubscribe = new WeakMap(), _SkyActionButtonContainerComponent_syncMaxHeightTimeout = new WeakMap(), _SkyActionButtonContainerComponent__alignItems = new WeakMap(), _SkyActionButtonContainerComponent__themeName = new WeakMap(), _SkyActionButtonContainerComponent_viewInitialized = new WeakMap(), _SkyActionButtonContainerComponent_actionButtonAdapterService = new WeakMap(), _SkyActionButtonContainerComponent_changeDetector = new WeakMap(), _SkyActionButtonContainerComponent_coreAdapterService = new WeakMap(), _SkyActionButtonContainerComponent_hostElRef = new WeakMap(), _SkyActionButtonContainerComponent_themeSvc = new WeakMap(), _SkyActionButtonContainerComponent_instances = new WeakSet(), _SkyActionButtonContainerComponent_themeName_set = function _SkyActionButtonContainerComponent_themeName_set(value) {
195
- __classPrivateFieldSet(this, _SkyActionButtonContainerComponent__themeName, value, "f");
196
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_instances, "m", _SkyActionButtonContainerComponent_updateResponsiveClass).call(this);
197
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_instances, "m", _SkyActionButtonContainerComponent_updateHeight).call(this);
198
- }, _SkyActionButtonContainerComponent_updateHeight = function _SkyActionButtonContainerComponent_updateHeight(delay = 0) {
199
- const ref = this.containerRef;
200
- if (ref && __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_viewInitialized, "f")) {
201
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_coreAdapterService, "f").resetHeight(ref, '.sky-action-button');
202
- if (__classPrivateFieldGet(this, _SkyActionButtonContainerComponent__themeName, "f") === 'modern') {
203
- // Wait for children components to complete rendering before height is determined.
204
- clearTimeout(__classPrivateFieldGet(this, _SkyActionButtonContainerComponent_syncMaxHeightTimeout, "f"));
205
- __classPrivateFieldSet(this, _SkyActionButtonContainerComponent_syncMaxHeightTimeout, setTimeout(() => {
206
- const selector = '.sky-action-button:not([hidden])';
207
- const button = ref.nativeElement.querySelector(selector);
208
- if (button && button.offsetHeight > 0) {
209
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_coreAdapterService, "f").syncMaxHeight(ref, selector);
210
- }
211
- else if (delay < 200) {
212
- // Wait progressively longer between retries.
213
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_instances, "m", _SkyActionButtonContainerComponent_updateHeight).call(this, delay + 50);
214
- }
215
- }, delay), "f");
216
- }
217
- }
218
- }, _SkyActionButtonContainerComponent_updateResponsiveClass = function _SkyActionButtonContainerComponent_updateResponsiveClass() {
219
- if (this.containerRef) {
220
- const parentWidth = __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_actionButtonAdapterService, "f").getParentWidth(__classPrivateFieldGet(this, _SkyActionButtonContainerComponent_hostElRef, "f"));
221
- __classPrivateFieldGet(this, _SkyActionButtonContainerComponent_actionButtonAdapterService, "f").setResponsiveClass(this.containerRef, parentWidth);
222
- }
223
- };
224
- SkyActionButtonContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonContainerComponent, deps: [{ token: SkyActionButtonAdapterService }, { token: i0.ChangeDetectorRef }, { token: i1$2.SkyCoreAdapterService }, { token: i0.ElementRef }, { token: i1$1.SkyThemeService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
225
- SkyActionButtonContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyActionButtonContainerComponent, selector: "sky-action-button-container", inputs: { alignItems: "alignItems" }, host: { listeners: { "window:resize": "onWindowResize()" } }, providers: [SkyActionButtonAdapterService], queries: [{ propertyName: "actionButtons", predicate: SkyActionButtonComponent }], viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div class=\"sky-action-button-container\" #container>\n <div\n class=\"sky-action-button-flex\"\n [ngClass]=\"{\n 'sky-action-button-flex-align-left': alignItems === 'left',\n 'sky-action-button-flex-align-center': alignItems === 'center'\n }\"\n (cdkObserveContent)=\"onContentChange()\"\n >\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [":host{display:block}.sky-action-button-flex sky-action-button{display:block}.sky-action-button-flex .sky-action-button{height:100%;min-width:236px;margin-left:10px;margin-right:10px}.sky-action-button-flex{display:block;padding:0;margin:calc(var(--sky-compat-action-button-flex-margin, 20px) * -1) 0}.sky-action-button-flex sky-action-button{margin:20px 0}.sky-responsive-container-xs .sky-action-button-flex,.sky-responsive-container-sm .sky-action-button-flex,.sky-responsive-container-md .sky-action-button-flex,.sky-responsive-container-lg .sky-action-button-flex{display:block;padding:0;margin:calc(var(--sky-compat-action-button-flex-margin, 20px) * -1) 0}.sky-responsive-container-xs .sky-action-button-flex sky-action-button,.sky-responsive-container-sm .sky-action-button-flex sky-action-button,.sky-responsive-container-md .sky-action-button-flex sky-action-button,.sky-responsive-container-lg .sky-action-button-flex sky-action-button{margin:20px 0}@media (min-width: 768px){.sky-action-button-flex{display:flex;flex-flow:row wrap;padding:var(--sky-compat-action-button-flex-sm-padding, 0) 0;margin:calc(var(--sky-compat-action-button-flex-margin, 10px) * -1) 0}.sky-action-button-flex.sky-action-button-flex-align-center{justify-content:center}.sky-action-button-flex.sky-action-button-flex-align-left{justify-content:flex-start}.sky-action-button-flex sky-action-button{margin:10px 0}}.sky-responsive-container-sm .sky-action-button-flex,.sky-responsive-container-md .sky-action-button-flex,.sky-responsive-container-lg .sky-action-button-flex{display:flex;flex-flow:row wrap;padding:var(--sky-compat-action-button-flex-sm-padding, 0) 0;margin:calc(var(--sky-compat-action-button-flex-margin, 10px) * -1) 0}.sky-responsive-container-sm .sky-action-button-flex.sky-action-button-flex-align-center,.sky-responsive-container-md .sky-action-button-flex.sky-action-button-flex-align-center,.sky-responsive-container-lg .sky-action-button-flex.sky-action-button-flex-align-center{justify-content:center}.sky-responsive-container-sm .sky-action-button-flex.sky-action-button-flex-align-left,.sky-responsive-container-md .sky-action-button-flex.sky-action-button-flex-align-left,.sky-responsive-container-lg .sky-action-button-flex.sky-action-button-flex-align-left{justify-content:flex-start}.sky-responsive-container-sm .sky-action-button-flex sky-action-button,.sky-responsive-container-md .sky-action-button-flex sky-action-button,.sky-responsive-container-lg .sky-action-button-flex sky-action-button{margin:10px 0}.sky-theme-modern .sky-action-button-container{margin:0 auto}.sky-theme-modern .sky-action-button-container.sky-action-button-container-sm{max-width:446px}.sky-theme-modern .sky-action-button-container.sky-action-button-container-md{max-width:912px}.sky-theme-modern .sky-action-button-container.sky-action-button-container-lg{max-width:1378px}.sky-theme-modern .sky-action-button-container .sky-action-button-flex .sky-action-button{height:auto;min-width:auto;margin:0}.sky-theme-modern .sky-action-button-flex{display:flex;flex-flow:row wrap;padding:0;margin:0 0 -20px -20px}.sky-theme-modern .sky-action-button-flex sky-action-button{margin:0 0 20px 20px;flex:0 1 446px}.sky-theme-modern .sky-responsive-container-xs .sky-action-button-flex,.sky-theme-modern .sky-responsive-container-sm .sky-action-button-flex,.sky-theme-modern .sky-responsive-container-md .sky-action-button-flex,.sky-theme-modern .sky-responsive-container-lg .sky-action-button-flex{display:flex;flex-flow:row wrap;padding:0;margin:0 0 -20px -20px}.sky-theme-modern .sky-responsive-container-xs .sky-action-button-flex sky-action-button,.sky-theme-modern .sky-responsive-container-sm .sky-action-button-flex sky-action-button,.sky-theme-modern .sky-responsive-container-md .sky-action-button-flex sky-action-button,.sky-theme-modern .sky-responsive-container-lg .sky-action-button-flex sky-action-button{margin:0 0 20px 20px;flex:0 1 446px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }], encapsulation: i0.ViewEncapsulation.None });
226
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonContainerComponent, decorators: [{
227
- type: Component,
228
- args: [{ selector: 'sky-action-button-container', providers: [SkyActionButtonAdapterService], encapsulation: ViewEncapsulation.None, template: "<div class=\"sky-action-button-container\" #container>\n <div\n class=\"sky-action-button-flex\"\n [ngClass]=\"{\n 'sky-action-button-flex-align-left': alignItems === 'left',\n 'sky-action-button-flex-align-center': alignItems === 'center'\n }\"\n (cdkObserveContent)=\"onContentChange()\"\n >\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [":host{display:block}.sky-action-button-flex sky-action-button{display:block}.sky-action-button-flex .sky-action-button{height:100%;min-width:236px;margin-left:10px;margin-right:10px}.sky-action-button-flex{display:block;padding:0;margin:calc(var(--sky-compat-action-button-flex-margin, 20px) * -1) 0}.sky-action-button-flex sky-action-button{margin:20px 0}.sky-responsive-container-xs .sky-action-button-flex,.sky-responsive-container-sm .sky-action-button-flex,.sky-responsive-container-md .sky-action-button-flex,.sky-responsive-container-lg .sky-action-button-flex{display:block;padding:0;margin:calc(var(--sky-compat-action-button-flex-margin, 20px) * -1) 0}.sky-responsive-container-xs .sky-action-button-flex sky-action-button,.sky-responsive-container-sm .sky-action-button-flex sky-action-button,.sky-responsive-container-md .sky-action-button-flex sky-action-button,.sky-responsive-container-lg .sky-action-button-flex sky-action-button{margin:20px 0}@media (min-width: 768px){.sky-action-button-flex{display:flex;flex-flow:row wrap;padding:var(--sky-compat-action-button-flex-sm-padding, 0) 0;margin:calc(var(--sky-compat-action-button-flex-margin, 10px) * -1) 0}.sky-action-button-flex.sky-action-button-flex-align-center{justify-content:center}.sky-action-button-flex.sky-action-button-flex-align-left{justify-content:flex-start}.sky-action-button-flex sky-action-button{margin:10px 0}}.sky-responsive-container-sm .sky-action-button-flex,.sky-responsive-container-md .sky-action-button-flex,.sky-responsive-container-lg .sky-action-button-flex{display:flex;flex-flow:row wrap;padding:var(--sky-compat-action-button-flex-sm-padding, 0) 0;margin:calc(var(--sky-compat-action-button-flex-margin, 10px) * -1) 0}.sky-responsive-container-sm .sky-action-button-flex.sky-action-button-flex-align-center,.sky-responsive-container-md .sky-action-button-flex.sky-action-button-flex-align-center,.sky-responsive-container-lg .sky-action-button-flex.sky-action-button-flex-align-center{justify-content:center}.sky-responsive-container-sm .sky-action-button-flex.sky-action-button-flex-align-left,.sky-responsive-container-md .sky-action-button-flex.sky-action-button-flex-align-left,.sky-responsive-container-lg .sky-action-button-flex.sky-action-button-flex-align-left{justify-content:flex-start}.sky-responsive-container-sm .sky-action-button-flex sky-action-button,.sky-responsive-container-md .sky-action-button-flex sky-action-button,.sky-responsive-container-lg .sky-action-button-flex sky-action-button{margin:10px 0}.sky-theme-modern .sky-action-button-container{margin:0 auto}.sky-theme-modern .sky-action-button-container.sky-action-button-container-sm{max-width:446px}.sky-theme-modern .sky-action-button-container.sky-action-button-container-md{max-width:912px}.sky-theme-modern .sky-action-button-container.sky-action-button-container-lg{max-width:1378px}.sky-theme-modern .sky-action-button-container .sky-action-button-flex .sky-action-button{height:auto;min-width:auto;margin:0}.sky-theme-modern .sky-action-button-flex{display:flex;flex-flow:row wrap;padding:0;margin:0 0 -20px -20px}.sky-theme-modern .sky-action-button-flex sky-action-button{margin:0 0 20px 20px;flex:0 1 446px}.sky-theme-modern .sky-responsive-container-xs .sky-action-button-flex,.sky-theme-modern .sky-responsive-container-sm .sky-action-button-flex,.sky-theme-modern .sky-responsive-container-md .sky-action-button-flex,.sky-theme-modern .sky-responsive-container-lg .sky-action-button-flex{display:flex;flex-flow:row wrap;padding:0;margin:0 0 -20px -20px}.sky-theme-modern .sky-responsive-container-xs .sky-action-button-flex sky-action-button,.sky-theme-modern .sky-responsive-container-sm .sky-action-button-flex sky-action-button,.sky-theme-modern .sky-responsive-container-md .sky-action-button-flex sky-action-button,.sky-theme-modern .sky-responsive-container-lg .sky-action-button-flex sky-action-button{margin:0 0 20px 20px;flex:0 1 446px}\n"] }]
229
- }], ctorParameters: function () { return [{ type: SkyActionButtonAdapterService }, { type: i0.ChangeDetectorRef }, { type: i1$2.SkyCoreAdapterService }, { type: i0.ElementRef }, { type: i1$1.SkyThemeService, decorators: [{
230
- type: Optional
231
- }] }]; }, propDecorators: { alignItems: [{
232
- type: Input
233
- }], actionButtons: [{
234
- type: ContentChildren,
235
- args: [SkyActionButtonComponent]
236
- }], containerRef: [{
237
- type: ViewChild,
238
- args: ['container', {
239
- read: ElementRef,
240
- static: true,
241
- }]
242
- }], onWindowResize: [{
243
- type: HostListener,
244
- args: ['window:resize']
245
- }] } });
246
-
247
- /**
248
- * Specifies a description to display on an action button.
249
- */
250
- class SkyActionButtonDetailsComponent {
251
- }
252
- SkyActionButtonDetailsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
253
- SkyActionButtonDetailsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyActionButtonDetailsComponent, selector: "sky-action-button-details", ngImport: i0, template: "<ng-content></ng-content>\n" });
254
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonDetailsComponent, decorators: [{
255
- type: Component,
256
- args: [{ selector: 'sky-action-button-details', template: "<ng-content></ng-content>\n" }]
257
- }] });
258
-
259
- /**
260
- * Specifies a header to display on an action button.
261
- */
262
- class SkyActionButtonHeaderComponent {
263
- }
264
- SkyActionButtonHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
265
- SkyActionButtonHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyActionButtonHeaderComponent, selector: "sky-action-button-header", ngImport: i0, template: "<div\n class=\"sky-action-button-header\"\n [skyThemeClass]=\"{\n 'sky-font-display-3': 'modern',\n 'sky-font-heading-2': 'default'\n }\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [":host .sky-action-button-header{margin:0 5px}:host-context(.sky-responsive-container-xs) .sky-action-button-header,:host-context(.sky-responsive-container-sm) .sky-action-button-header,:host-context(.sky-responsive-container-md) .sky-action-button-header,:host-context(.sky-responsive-container-lg) .sky-action-button-header{margin:0 5px}@media (min-width: 768px){:host .sky-action-button-header{margin:0 0 20px}}:host-context(.sky-responsive-container-sm) .sky-action-button-header,:host-context(.sky-responsive-container-md) .sky-action-button-header,:host-context(.sky-responsive-container-lg) .sky-action-button-header{margin:0 0 20px}:host-context(.sky-theme-modern) .sky-action-button-header{margin:0 0 10px}.sky-theme-modern .sky-action-button-header{margin:0 0 10px}\n"], dependencies: [{ kind: "directive", type: i1$1.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }] });
266
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonHeaderComponent, decorators: [{
267
- type: Component,
268
- args: [{ selector: 'sky-action-button-header', template: "<div\n class=\"sky-action-button-header\"\n [skyThemeClass]=\"{\n 'sky-font-display-3': 'modern',\n 'sky-font-heading-2': 'default'\n }\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [":host .sky-action-button-header{margin:0 5px}:host-context(.sky-responsive-container-xs) .sky-action-button-header,:host-context(.sky-responsive-container-sm) .sky-action-button-header,:host-context(.sky-responsive-container-md) .sky-action-button-header,:host-context(.sky-responsive-container-lg) .sky-action-button-header{margin:0 5px}@media (min-width: 768px){:host .sky-action-button-header{margin:0 0 20px}}:host-context(.sky-responsive-container-sm) .sky-action-button-header,:host-context(.sky-responsive-container-md) .sky-action-button-header,:host-context(.sky-responsive-container-lg) .sky-action-button-header{margin:0 0 20px}:host-context(.sky-theme-modern) .sky-action-button-header{margin:0 0 10px}.sky-theme-modern .sky-action-button-header{margin:0 0 10px}\n"] }]
269
- }] });
270
-
271
- var _SkyActionButtonIconComponent_subscription;
272
- const FONTSIZECLASS_SMALL = '2x';
273
- const FONTSIZECLASS_LARGE = '3x';
274
- /**
275
- * Specifies an icon to display on the action button.
276
- */
277
- class SkyActionButtonIconComponent {
278
- constructor(mediaQueryService) {
279
- this.fontSizeClass = FONTSIZECLASS_LARGE;
280
- _SkyActionButtonIconComponent_subscription.set(this, void 0);
281
- __classPrivateFieldSet(this, _SkyActionButtonIconComponent_subscription, mediaQueryService.subscribe((args) => {
282
- if (args === SkyMediaBreakpoints.xs) {
283
- this.fontSizeClass = FONTSIZECLASS_SMALL;
284
- }
285
- else {
286
- this.fontSizeClass = FONTSIZECLASS_LARGE;
287
- }
288
- }), "f");
289
- }
290
- ngOnDestroy() {
291
- /* istanbul ignore else */
292
- /* sanity check */
293
- if (__classPrivateFieldGet(this, _SkyActionButtonIconComponent_subscription, "f")) {
294
- __classPrivateFieldGet(this, _SkyActionButtonIconComponent_subscription, "f").unsubscribe();
295
- }
296
- }
297
- }
298
- _SkyActionButtonIconComponent_subscription = new WeakMap();
299
- SkyActionButtonIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonIconComponent, deps: [{ token: i1$2.SkyMediaQueryService }], target: i0.ɵɵFactoryTarget.Component });
300
- SkyActionButtonIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyActionButtonIconComponent, selector: "sky-action-button-icon", inputs: { iconType: "iconType" }, ngImport: i0, template: "<div aria-hidden=\"true\" class=\"sky-action-button-icon-container\">\n <sky-icon\n class=\"sky-action-button-icon\"\n [icon]=\"iconType\"\n [size]=\"fontSizeClass\"\n ></sky-icon>\n</div>\n", styles: [":host .sky-action-button-icon-container{margin:0 5px}:host-context(.sky-responsive-container-xs) .sky-action-button-icon-container,:host-context(.sky-responsive-container-sm) .sky-action-button-icon-container,:host-context(.sky-responsive-container-md) .sky-action-button-icon-container,:host-context(.sky-responsive-container-lg) .sky-action-button-icon-container{margin:0 5px}@media (min-width: 768px){:host .sky-action-button-icon-container{margin:0 0 20px}}:host-context(.sky-responsive-container-sm) .sky-action-button-icon-container,:host-context(.sky-responsive-container-md) .sky-action-button-icon-container,:host-context(.sky-responsive-container-lg) .sky-action-button-icon-container{margin:0 0 20px}.sky-action-button-icon{color:#0974a1}:host-context(.sky-theme-modern) .sky-action-button-icon-container{color:#0974a1;background:#ebfbff;margin:0 20px 0 0;border-radius:50%;width:42px;height:42px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}:host-context(.sky-theme-modern) .sky-action-button-icon-container ::ng-deep .sky-icon{font-size:24px!important}.sky-theme-modern .sky-action-button-icon-container{color:#0974a1;background:#ebfbff;margin:0 20px 0 0;border-radius:50%;width:42px;height:42px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.sky-theme-modern .sky-action-button-icon-container ::ng-deep .sky-icon{font-size:24px!important}\n"], dependencies: [{ kind: "component", type: i2$1.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }] });
301
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonIconComponent, decorators: [{
302
- type: Component,
303
- args: [{ selector: 'sky-action-button-icon', template: "<div aria-hidden=\"true\" class=\"sky-action-button-icon-container\">\n <sky-icon\n class=\"sky-action-button-icon\"\n [icon]=\"iconType\"\n [size]=\"fontSizeClass\"\n ></sky-icon>\n</div>\n", styles: [":host .sky-action-button-icon-container{margin:0 5px}:host-context(.sky-responsive-container-xs) .sky-action-button-icon-container,:host-context(.sky-responsive-container-sm) .sky-action-button-icon-container,:host-context(.sky-responsive-container-md) .sky-action-button-icon-container,:host-context(.sky-responsive-container-lg) .sky-action-button-icon-container{margin:0 5px}@media (min-width: 768px){:host .sky-action-button-icon-container{margin:0 0 20px}}:host-context(.sky-responsive-container-sm) .sky-action-button-icon-container,:host-context(.sky-responsive-container-md) .sky-action-button-icon-container,:host-context(.sky-responsive-container-lg) .sky-action-button-icon-container{margin:0 0 20px}.sky-action-button-icon{color:#0974a1}:host-context(.sky-theme-modern) .sky-action-button-icon-container{color:#0974a1;background:#ebfbff;margin:0 20px 0 0;border-radius:50%;width:42px;height:42px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}:host-context(.sky-theme-modern) .sky-action-button-icon-container ::ng-deep .sky-icon{font-size:24px!important}.sky-theme-modern .sky-action-button-icon-container{color:#0974a1;background:#ebfbff;margin:0 20px 0 0;border-radius:50%;width:42px;height:42px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.sky-theme-modern .sky-action-button-icon-container ::ng-deep .sky-icon{font-size:24px!important}\n"] }]
304
- }], ctorParameters: function () { return [{ type: i1$2.SkyMediaQueryService }]; }, propDecorators: { iconType: [{
305
- type: Input
306
- }] } });
307
-
308
- class SkyActionButtonModule {
309
- }
310
- SkyActionButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
311
- SkyActionButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonModule, declarations: [SkyActionButtonComponent,
312
- SkyActionButtonContainerComponent,
313
- SkyActionButtonDetailsComponent,
314
- SkyActionButtonHeaderComponent,
315
- SkyActionButtonIconComponent], imports: [CommonModule,
316
- ObserversModule,
317
- RouterModule,
318
- SkyHrefModule,
319
- SkyIconModule,
320
- SkyThemeModule], exports: [SkyActionButtonComponent,
321
- SkyActionButtonContainerComponent,
322
- SkyActionButtonDetailsComponent,
323
- SkyActionButtonHeaderComponent,
324
- SkyActionButtonIconComponent] });
325
- SkyActionButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonModule, imports: [CommonModule,
326
- ObserversModule,
327
- RouterModule,
328
- SkyHrefModule,
329
- SkyIconModule,
330
- SkyThemeModule] });
331
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyActionButtonModule, decorators: [{
332
- type: NgModule,
333
- args: [{
334
- declarations: [
335
- SkyActionButtonComponent,
336
- SkyActionButtonContainerComponent,
337
- SkyActionButtonDetailsComponent,
338
- SkyActionButtonHeaderComponent,
339
- SkyActionButtonIconComponent,
340
- ],
341
- imports: [
342
- CommonModule,
343
- ObserversModule,
344
- RouterModule,
345
- SkyHrefModule,
346
- SkyIconModule,
347
- SkyThemeModule,
348
- ],
349
- exports: [
350
- SkyActionButtonComponent,
351
- SkyActionButtonContainerComponent,
352
- SkyActionButtonDetailsComponent,
353
- SkyActionButtonHeaderComponent,
354
- SkyActionButtonIconComponent,
355
- ],
356
- }]
357
- }] });
358
-
359
- /**
360
- * NOTICE: DO NOT MODIFY THIS FILE!
361
- * The contents of this file were automatically generated by
362
- * the 'ng generate @skyux/i18n:lib-resources-module lib/modules/shared/sky-layout' schematic.
363
- * To update this file, simply rerun the command.
364
- */
365
- const RESOURCES = {
366
- 'EN-US': {
367
- skyux_back_to_top: { message: 'Back to top' },
368
- skyux_card_checkbox_label: { message: 'Select card' },
369
- skyux_definition_list_none_found: { message: 'None found.' },
370
- skyux_description_list_none_found: { message: 'None found.' },
371
- skyux_inline_delete_assistive_text: {
372
- message: 'Are you sure you want to delete this item?',
373
- },
374
- skyux_inline_delete_cancel: { message: 'Cancel' },
375
- skyux_inline_delete_confirm_deletion: { message: 'Confirm deletion' },
376
- skyux_inline_delete_delete: { message: 'Delete' },
377
- skyux_text_expand_close_text: { message: 'Close' },
378
- skyux_text_expand_modal_title: { message: 'Expanded view' },
379
- skyux_text_expand_see_less: { message: 'See less' },
380
- skyux_text_expand_see_more: { message: 'See more' },
381
- },
382
- };
383
- class SkyLayoutResourcesProvider {
384
- getString(localeInfo, name) {
385
- return getLibStringForLocale(RESOURCES, localeInfo.locale, name);
386
- }
387
- }
388
- /**
389
- * Import into any component library module that needs to use resource strings.
390
- */
391
- class SkyLayoutResourcesModule {
392
- }
393
- SkyLayoutResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyLayoutResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
394
- SkyLayoutResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyLayoutResourcesModule, exports: [SkyI18nModule] });
395
- SkyLayoutResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyLayoutResourcesModule, providers: [
396
- {
397
- provide: SKY_LIB_RESOURCES_PROVIDERS,
398
- useClass: SkyLayoutResourcesProvider,
399
- multi: true,
400
- },
401
- ], imports: [SkyI18nModule] });
402
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyLayoutResourcesModule, decorators: [{
403
- type: NgModule,
404
- args: [{
405
- exports: [SkyI18nModule],
406
- providers: [
407
- {
408
- provide: SKY_LIB_RESOURCES_PROVIDERS,
409
- useClass: SkyLayoutResourcesProvider,
410
- multi: true,
411
- },
412
- ],
413
- }]
414
- }] });
415
-
416
- var _SkyBackToTopComponent__scrollToTopClick;
417
- /**
418
- * @internal
419
- */
420
- class SkyBackToTopComponent {
421
- constructor() {
422
- _SkyBackToTopComponent__scrollToTopClick.set(this, new Subject());
423
- }
424
- get scrollToTopClick() {
425
- return __classPrivateFieldGet(this, _SkyBackToTopComponent__scrollToTopClick, "f").asObservable();
426
- }
427
- onScrollToTopClick() {
428
- __classPrivateFieldGet(this, _SkyBackToTopComponent__scrollToTopClick, "f").next();
429
- __classPrivateFieldGet(this, _SkyBackToTopComponent__scrollToTopClick, "f").complete();
430
- }
431
- }
432
- _SkyBackToTopComponent__scrollToTopClick = new WeakMap();
433
- SkyBackToTopComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBackToTopComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
434
- SkyBackToTopComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyBackToTopComponent, selector: "sky-back-to-top", ngImport: i0, template: "<div\n class=\"sky-back-to-top\"\n [skyThemeClass]=\"{\n 'sky-shadow': 'default',\n 'sky-elevation-3': 'modern'\n }\"\n>\n <button\n class=\"sky-btn sky-btn-link-inline\"\n type=\"button\"\n (click)=\"onScrollToTopClick()\"\n >\n {{ 'skyux_back_to_top' | skyLibResources }}\n </button>\n</div>\n", styles: [".sky-back-to-top{display:flex;align-items:center;width:100%;background-color:#fff;padding:var(--sky-margin-stacked-sm) var(--sky-margin-inline-lg)}:host-context(.sky-theme-modern) .sky-back-to-top{padding:var(--sky-margin-stacked-sm) var(--sky-margin-inline-xl)}.sky-theme-modern .sky-back-to-top{padding:var(--sky-margin-stacked-sm) var(--sky-margin-inline-xl)}\n"], dependencies: [{ kind: "directive", type: i1$1.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "pipe", type: i1$3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
435
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBackToTopComponent, decorators: [{
436
- type: Component,
437
- args: [{ selector: 'sky-back-to-top', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"sky-back-to-top\"\n [skyThemeClass]=\"{\n 'sky-shadow': 'default',\n 'sky-elevation-3': 'modern'\n }\"\n>\n <button\n class=\"sky-btn sky-btn-link-inline\"\n type=\"button\"\n (click)=\"onScrollToTopClick()\"\n >\n {{ 'skyux_back_to_top' | skyLibResources }}\n </button>\n</div>\n", styles: [".sky-back-to-top{display:flex;align-items:center;width:100%;background-color:#fff;padding:var(--sky-margin-stacked-sm) var(--sky-margin-inline-lg)}:host-context(.sky-theme-modern) .sky-back-to-top{padding:var(--sky-margin-stacked-sm) var(--sky-margin-inline-xl)}.sky-theme-modern .sky-back-to-top{padding:var(--sky-margin-stacked-sm) var(--sky-margin-inline-xl)}\n"] }]
438
- }] });
439
-
440
- var _SkyBackToTopDomAdapterService_ngUnsubscribe, _SkyBackToTopDomAdapterService_scrollableHostScrollEventUnsubscribe, _SkyBackToTopDomAdapterService_scrollableHostService, _SkyBackToTopDomAdapterService_windowRef;
441
- /**
442
- * @internal
443
- */
444
- class SkyBackToTopDomAdapterService {
445
- constructor(windowRef, scrollableHostService) {
446
- _SkyBackToTopDomAdapterService_ngUnsubscribe.set(this, new Subject());
447
- _SkyBackToTopDomAdapterService_scrollableHostScrollEventUnsubscribe.set(this, new Subject());
448
- _SkyBackToTopDomAdapterService_scrollableHostService.set(this, void 0);
449
- _SkyBackToTopDomAdapterService_windowRef.set(this, void 0);
450
- __classPrivateFieldSet(this, _SkyBackToTopDomAdapterService_windowRef, windowRef, "f");
451
- __classPrivateFieldSet(this, _SkyBackToTopDomAdapterService_scrollableHostService, scrollableHostService, "f");
452
- }
453
- ngOnDestroy() {
454
- __classPrivateFieldGet(this, _SkyBackToTopDomAdapterService_ngUnsubscribe, "f").next();
455
- __classPrivateFieldGet(this, _SkyBackToTopDomAdapterService_ngUnsubscribe, "f").complete();
456
- __classPrivateFieldGet(this, _SkyBackToTopDomAdapterService_scrollableHostScrollEventUnsubscribe, "f").next();
457
- __classPrivateFieldGet(this, _SkyBackToTopDomAdapterService_scrollableHostScrollEventUnsubscribe, "f").complete();
458
- }
459
- /**
460
- * This event returns a boolean on scroll indicating whether the provided element is in view.
461
- * @param elementRef The target element reference.
462
- */
463
- elementInViewOnScroll(elementRef) {
464
- const scrollableHostObservable = __classPrivateFieldGet(this, _SkyBackToTopDomAdapterService_scrollableHostService, "f").watchScrollableHostScrollEvents(elementRef);
465
- const isInitiallyInView = this.isElementScrolledInView(elementRef);
466
- const returnedObservable = new BehaviorSubject(isInitiallyInView);
467
- scrollableHostObservable
468
- .pipe(takeUntil(__classPrivateFieldGet(this, _SkyBackToTopDomAdapterService_scrollableHostScrollEventUnsubscribe, "f")))
469
- .subscribe(() => {
470
- const isInView = this.isElementScrolledInView(elementRef);
471
- returnedObservable.next(isInView);
472
- });
473
- return returnedObservable;
474
- }
475
- /**
476
- * Scrolls the window or scrollable parent to the provided element.
477
- * @param elementRef The target element reference.
478
- */
479
- scrollToElement(elementRef) {
480
- /* sanity check */
481
- /* istanbul ignore if */
482
- if (!elementRef || !elementRef.nativeElement) {
483
- return;
484
- }
485
- const scrollableHost = __classPrivateFieldGet(this, _SkyBackToTopDomAdapterService_scrollableHostService, "f").getScrollableHost(elementRef);
486
- if (scrollableHost instanceof Window) {
487
- // Scroll to top of window, but account for the body margin that allows for the omnibar if it exists.
488
- const bodyMarginOffset = parseInt(getComputedStyle(document.body).marginTop, 10);
489
- const newOffsetTop = elementRef.nativeElement.offsetTop - bodyMarginOffset;
490
- __classPrivateFieldGet(this, _SkyBackToTopDomAdapterService_windowRef, "f").nativeWindow.scrollTo(elementRef.nativeElement.offsetLeft, newOffsetTop);
491
- }
492
- else {
493
- // Scroll to top of parent element.
494
- scrollableHost.scrollTop =
495
- scrollableHost.offsetTop - elementRef.nativeElement.offsetTop;
496
- }
497
- }
498
- isElementScrolledInView(element) {
499
- const parentElement = __classPrivateFieldGet(this, _SkyBackToTopDomAdapterService_scrollableHostService, "f").getScrollableHost(element);
500
- if (!element.nativeElement.offsetParent) {
501
- return true;
502
- }
503
- const buffer = 25;
504
- const elementRect = element.nativeElement.getBoundingClientRect();
505
- if (parentElement instanceof HTMLElement) {
506
- const parentRect = parentElement.getBoundingClientRect();
507
- return elementRect.top > parentRect.top - buffer;
508
- }
509
- else {
510
- return elementRect.top > -buffer;
511
- }
512
- }
513
- }
514
- _SkyBackToTopDomAdapterService_ngUnsubscribe = new WeakMap(), _SkyBackToTopDomAdapterService_scrollableHostScrollEventUnsubscribe = new WeakMap(), _SkyBackToTopDomAdapterService_scrollableHostService = new WeakMap(), _SkyBackToTopDomAdapterService_windowRef = new WeakMap();
515
- SkyBackToTopDomAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBackToTopDomAdapterService, deps: [{ token: i1$2.SkyAppWindowRef }, { token: i1$2.SkyScrollableHostService }], target: i0.ɵɵFactoryTarget.Injectable });
516
- SkyBackToTopDomAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBackToTopDomAdapterService });
517
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBackToTopDomAdapterService, decorators: [{
518
- type: Injectable
519
- }], ctorParameters: function () { return [{ type: i1$2.SkyAppWindowRef }, { type: i1$2.SkyScrollableHostService }]; } });
520
-
521
- /**
522
- * The type of message to send to the back to top component.
523
- */
524
- var SkyBackToTopMessageType;
525
- (function (SkyBackToTopMessageType) {
526
- /**
527
- * Scrolls the element back to the top.
528
- */
529
- SkyBackToTopMessageType[SkyBackToTopMessageType["BackToTop"] = 0] = "BackToTop";
530
- })(SkyBackToTopMessageType || (SkyBackToTopMessageType = {}));
531
-
532
- var _SkyBackToTopDirective_instances, _SkyBackToTopDirective_buttonHidden, _SkyBackToTopDirective_dockItem, _SkyBackToTopDirective_dockService, _SkyBackToTopDirective_domAdapter, _SkyBackToTopDirective_elementInView, _SkyBackToTopDirective_elementRef, _SkyBackToTopDirective_ngUnsubscribe, _SkyBackToTopDirective__skyBackToTopMessageStream, _SkyBackToTopDirective_handleBackToTopButton, _SkyBackToTopDirective_addBackToTop, _SkyBackToTopDirective_handleIncomingMessages, _SkyBackToTopDirective_setBackToTopListeners, _SkyBackToTopDirective_destroyBackToTop;
533
- /**
534
- * Associates a button with an element on the page and displays that button
535
- * to return to the element after users scroll away.
536
- */
537
- class SkyBackToTopDirective {
538
- /**
539
- * Configuration options for the back to top component.
540
- */
541
- set skyBackToTop(value) {
542
- __classPrivateFieldSet(this, _SkyBackToTopDirective_buttonHidden, !!(value && value?.buttonHidden), "f");
543
- __classPrivateFieldGet(this, _SkyBackToTopDirective_instances, "m", _SkyBackToTopDirective_handleBackToTopButton).call(this, __classPrivateFieldGet(this, _SkyBackToTopDirective_elementInView, "f"));
544
- }
545
- /**
546
- * The observable to send commands to the back to top component.
547
- * The commands respect the `SkyBackToTopMessage` type.
548
- */
549
- set skyBackToTopMessageStream(value) {
550
- if (__classPrivateFieldGet(this, _SkyBackToTopDirective__skyBackToTopMessageStream, "f")) {
551
- __classPrivateFieldGet(this, _SkyBackToTopDirective__skyBackToTopMessageStream, "f").unsubscribe();
552
- }
553
- __classPrivateFieldSet(this, _SkyBackToTopDirective__skyBackToTopMessageStream, value, "f");
554
- __classPrivateFieldGet(this, _SkyBackToTopDirective__skyBackToTopMessageStream, "f")
555
- ?.pipe(takeUntil(__classPrivateFieldGet(this, _SkyBackToTopDirective_ngUnsubscribe, "f")))
556
- .subscribe((message) => __classPrivateFieldGet(this, _SkyBackToTopDirective_instances, "m", _SkyBackToTopDirective_handleIncomingMessages).call(this, message));
557
- }
558
- constructor(dockService, domAdapter, elementRef) {
559
- _SkyBackToTopDirective_instances.add(this);
560
- _SkyBackToTopDirective_buttonHidden.set(this, false);
561
- _SkyBackToTopDirective_dockItem.set(this, void 0);
562
- _SkyBackToTopDirective_dockService.set(this, void 0);
563
- _SkyBackToTopDirective_domAdapter.set(this, void 0);
564
- _SkyBackToTopDirective_elementInView.set(this, false);
565
- _SkyBackToTopDirective_elementRef.set(this, void 0);
566
- _SkyBackToTopDirective_ngUnsubscribe.set(this, new Subject());
567
- _SkyBackToTopDirective__skyBackToTopMessageStream.set(this, void 0);
568
- __classPrivateFieldSet(this, _SkyBackToTopDirective_dockService, dockService, "f");
569
- __classPrivateFieldSet(this, _SkyBackToTopDirective_domAdapter, domAdapter, "f");
570
- __classPrivateFieldSet(this, _SkyBackToTopDirective_elementRef, elementRef, "f");
571
- }
572
- ngAfterViewInit() {
573
- __classPrivateFieldSet(this, _SkyBackToTopDirective_elementInView, __classPrivateFieldGet(this, _SkyBackToTopDirective_domAdapter, "f").isElementScrolledInView(__classPrivateFieldGet(this, _SkyBackToTopDirective_elementRef, "f")), "f");
574
- __classPrivateFieldGet(this, _SkyBackToTopDirective_instances, "m", _SkyBackToTopDirective_handleBackToTopButton).call(this, __classPrivateFieldGet(this, _SkyBackToTopDirective_elementInView, "f"));
575
- __classPrivateFieldGet(this, _SkyBackToTopDirective_instances, "m", _SkyBackToTopDirective_setBackToTopListeners).call(this);
576
- }
577
- ngOnDestroy() {
578
- if (__classPrivateFieldGet(this, _SkyBackToTopDirective_dockItem, "f")) {
579
- __classPrivateFieldGet(this, _SkyBackToTopDirective_dockItem, "f").destroy();
580
- }
581
- }
582
- }
583
- _SkyBackToTopDirective_buttonHidden = new WeakMap(), _SkyBackToTopDirective_dockItem = new WeakMap(), _SkyBackToTopDirective_dockService = new WeakMap(), _SkyBackToTopDirective_domAdapter = new WeakMap(), _SkyBackToTopDirective_elementInView = new WeakMap(), _SkyBackToTopDirective_elementRef = new WeakMap(), _SkyBackToTopDirective_ngUnsubscribe = new WeakMap(), _SkyBackToTopDirective__skyBackToTopMessageStream = new WeakMap(), _SkyBackToTopDirective_instances = new WeakSet(), _SkyBackToTopDirective_handleBackToTopButton = function _SkyBackToTopDirective_handleBackToTopButton(elementInView) {
584
- // Add back to top button if user scrolls down and button is not hidden.
585
- if (!__classPrivateFieldGet(this, _SkyBackToTopDirective_dockItem, "f") &&
586
- elementInView !== undefined &&
587
- !elementInView &&
588
- !__classPrivateFieldGet(this, _SkyBackToTopDirective_buttonHidden, "f")) {
589
- __classPrivateFieldGet(this, _SkyBackToTopDirective_instances, "m", _SkyBackToTopDirective_addBackToTop).call(this);
590
- }
591
- // Remove back to top button if user scrolls back up.
592
- if (elementInView || __classPrivateFieldGet(this, _SkyBackToTopDirective_buttonHidden, "f")) {
593
- __classPrivateFieldGet(this, _SkyBackToTopDirective_instances, "m", _SkyBackToTopDirective_destroyBackToTop).call(this);
594
- }
595
- }, _SkyBackToTopDirective_addBackToTop = function _SkyBackToTopDirective_addBackToTop() {
596
- __classPrivateFieldSet(this, _SkyBackToTopDirective_dockItem, __classPrivateFieldGet(this, _SkyBackToTopDirective_dockService, "f").insertComponent(SkyBackToTopComponent), "f");
597
- // Listen for clicks on the "back to top" button so we know when to scroll up.
598
- __classPrivateFieldGet(this, _SkyBackToTopDirective_dockItem, "f").componentInstance.scrollToTopClick
599
- .pipe(takeUntil(__classPrivateFieldGet(this, _SkyBackToTopDirective_ngUnsubscribe, "f")))
600
- .subscribe(() => {
601
- __classPrivateFieldGet(this, _SkyBackToTopDirective_domAdapter, "f").scrollToElement(__classPrivateFieldGet(this, _SkyBackToTopDirective_elementRef, "f"));
602
- });
603
- }, _SkyBackToTopDirective_handleIncomingMessages = function _SkyBackToTopDirective_handleIncomingMessages(message) {
604
- /* istanbul ignore else */
605
- if (message.type === SkyBackToTopMessageType.BackToTop) {
606
- __classPrivateFieldGet(this, _SkyBackToTopDirective_domAdapter, "f").scrollToElement(__classPrivateFieldGet(this, _SkyBackToTopDirective_elementRef, "f"));
607
- }
608
- }, _SkyBackToTopDirective_setBackToTopListeners = function _SkyBackToTopDirective_setBackToTopListeners() {
609
- /* istanbul ignore else */
610
- if (__classPrivateFieldGet(this, _SkyBackToTopDirective_elementRef, "f")) {
611
- __classPrivateFieldGet(this, _SkyBackToTopDirective_domAdapter, "f")
612
- .elementInViewOnScroll(__classPrivateFieldGet(this, _SkyBackToTopDirective_elementRef, "f"))
613
- .pipe(takeUntil(__classPrivateFieldGet(this, _SkyBackToTopDirective_ngUnsubscribe, "f")))
614
- .subscribe((elementInView) => {
615
- __classPrivateFieldSet(this, _SkyBackToTopDirective_elementInView, elementInView, "f");
616
- __classPrivateFieldGet(this, _SkyBackToTopDirective_instances, "m", _SkyBackToTopDirective_handleBackToTopButton).call(this, elementInView);
617
- });
618
- }
619
- }, _SkyBackToTopDirective_destroyBackToTop = function _SkyBackToTopDirective_destroyBackToTop() {
620
- /* istanbul ignore else */
621
- if (__classPrivateFieldGet(this, _SkyBackToTopDirective_dockItem, "f")) {
622
- __classPrivateFieldGet(this, _SkyBackToTopDirective_dockItem, "f").destroy();
623
- __classPrivateFieldSet(this, _SkyBackToTopDirective_dockItem, undefined, "f");
624
- }
625
- };
626
- SkyBackToTopDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBackToTopDirective, deps: [{ token: i1$2.SkyDockService }, { token: SkyBackToTopDomAdapterService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
627
- SkyBackToTopDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: SkyBackToTopDirective, selector: "[skyBackToTop]", inputs: { skyBackToTop: "skyBackToTop", skyBackToTopMessageStream: "skyBackToTopMessageStream" }, providers: [SkyBackToTopDomAdapterService], ngImport: i0 });
628
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBackToTopDirective, decorators: [{
629
- type: Directive,
630
- args: [{
631
- selector: '[skyBackToTop]',
632
- providers: [SkyBackToTopDomAdapterService],
633
- }]
634
- }], ctorParameters: function () { return [{ type: i1$2.SkyDockService }, { type: SkyBackToTopDomAdapterService }, { type: i0.ElementRef }]; }, propDecorators: { skyBackToTop: [{
635
- type: Input
636
- }], skyBackToTopMessageStream: [{
637
- type: Input
638
- }] } });
639
-
640
- class SkyBackToTopModule {
641
- }
642
- SkyBackToTopModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBackToTopModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
643
- SkyBackToTopModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyBackToTopModule, declarations: [SkyBackToTopComponent, SkyBackToTopDirective], imports: [CommonModule,
644
- SkyDockModule,
645
- SkyI18nModule,
646
- SkyLayoutResourcesModule,
647
- SkyThemeModule], exports: [SkyBackToTopComponent, SkyBackToTopDirective] });
648
- SkyBackToTopModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBackToTopModule, imports: [CommonModule,
649
- SkyDockModule,
650
- SkyI18nModule,
651
- SkyLayoutResourcesModule,
652
- SkyThemeModule] });
653
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBackToTopModule, decorators: [{
654
- type: NgModule,
655
- args: [{
656
- declarations: [SkyBackToTopComponent, SkyBackToTopDirective],
657
- imports: [
658
- CommonModule,
659
- SkyDockModule,
660
- SkyI18nModule,
661
- SkyLayoutResourcesModule,
662
- SkyThemeModule,
663
- ],
664
- exports: [SkyBackToTopComponent, SkyBackToTopDirective],
665
- }]
666
- }] });
667
-
668
- /**
669
- * Specifies the body content to display inside the box and provides padding around that content.
670
- */
671
- class SkyBoxContentComponent {
672
- }
673
- SkyBoxContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBoxContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
674
- SkyBoxContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyBoxContentComponent, selector: "sky-box-content", ngImport: i0, template: "<div class=\"sky-box-content\">\n <ng-content></ng-content>\n</div>\n" });
675
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBoxContentComponent, decorators: [{
676
- type: Component,
677
- args: [{ selector: 'sky-box-content', template: "<div class=\"sky-box-content\">\n <ng-content></ng-content>\n</div>\n" }]
678
- }] });
679
-
680
- /**
681
- * Specifies the controls to display in upper right corner of the box. These buttons typically let users edit the box content.
682
- */
683
- class SkyBoxControlsComponent {
684
- }
685
- SkyBoxControlsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBoxControlsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
686
- SkyBoxControlsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyBoxControlsComponent, selector: "sky-box-controls", ngImport: i0, template: "<div class=\"sky-box-controls\">\n <ng-content></ng-content>\n</div>\n" });
687
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBoxControlsComponent, decorators: [{
688
- type: Component,
689
- args: [{ selector: 'sky-box-controls', template: "<div class=\"sky-box-controls\">\n <ng-content></ng-content>\n</div>\n" }]
690
- }] });
691
-
692
- /**
693
- * Specifies a header for the box.
694
- */
695
- class SkyBoxHeaderComponent {
696
- }
697
- SkyBoxHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBoxHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
698
- SkyBoxHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyBoxHeaderComponent, selector: "sky-box-header", ngImport: i0, template: "<div class=\"sky-box-header\">\n <span skyTrim><ng-content></ng-content></span\n ><span class=\"sky-control-help-container\"\n ><ng-content select=\".sky-control-help\"></ng-content\n ></span>\n</div>\n", styles: ["sky-box-header{flex:1 0;order:0}sky-box-header .sky-box-header{padding:0 var(--sky-margin-inline-xl) 0 0}sky-box-header .sky-box-header h1,sky-box-header .sky-box-header h2,sky-box-header .sky-box-header h3,sky-box-header .sky-box-header h4,sky-box-header .sky-box-header h5,sky-box-header .sky-box-header h6{display:inline;margin:0}\n"], dependencies: [{ kind: "directive", type: i1$2.λ4, selector: "[skyTrim]" }], encapsulation: i0.ViewEncapsulation.None });
699
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBoxHeaderComponent, decorators: [{
700
- type: Component,
701
- args: [{ selector: 'sky-box-header', encapsulation: ViewEncapsulation.None, template: "<div class=\"sky-box-header\">\n <span skyTrim><ng-content></ng-content></span\n ><span class=\"sky-control-help-container\"\n ><ng-content select=\".sky-control-help\"></ng-content\n ></span>\n</div>\n", styles: ["sky-box-header{flex:1 0;order:0}sky-box-header .sky-box-header{padding:0 var(--sky-margin-inline-xl) 0 0}sky-box-header .sky-box-header h1,sky-box-header .sky-box-header h2,sky-box-header .sky-box-header h3,sky-box-header .sky-box-header h4,sky-box-header .sky-box-header h5,sky-box-header .sky-box-header h6{display:inline;margin:0}\n"] }]
702
- }] });
703
-
704
- /**
705
- * Provides a common look-and-feel for box content with options to display a common box header, specify body content, and display common box controls.
706
- */
707
- class SkyBoxComponent {
708
- }
709
- SkyBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
710
- SkyBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyBoxComponent, selector: "sky-box", inputs: { ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", ariaRole: "ariaRole" }, ngImport: i0, template: "<section\n class=\"sky-box\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.role]=\"ariaRole\"\n [skyThemeClass]=\"{\n 'sky-shadow sky-border-dark': 'default',\n 'sky-elevation-1-bordered': 'modern'\n }\"\n>\n <div class=\"sky-box-header-content\">\n <ng-content select=\"sky-box-header\"></ng-content>\n <ng-content select=\"sky-box-controls\"></ng-content>\n </div>\n <ng-content></ng-content>\n</section>\n", styles: ["sky-box{--sky-box-border-radius: initial;--sky-box-overflow: initial}.sky-theme-modern sky-box{--sky-box-border-radius: $sky-theme-modern-box-border-radius-default;--sky-box-overflow: hidden}sky-box{display:block}.sky-box{background-color:#fff;border-radius:var(--sky-box-border-radius);overflow:var(--sky-box-overflow)}.sky-box .sky-box-header-content{display:flex;flex-direction:row;flex-wrap:wrap;align-items:baseline;padding:var(--sky-padding-even-xl) var(--sky-padding-even-xl) 0 var(--sky-padding-even-xl)}.sky-box .sky-box-header-content:empty{display:none}.sky-box .sky-box-header-content sky-box-controls{order:1;margin-left:auto}.sky-box .sky-box-header-content sky-box-controls .sky-box-controls{position:relative;top:-2px}.sky-box sky-box-content{flex:0 1 100%;order:2}.sky-box sky-box-content .sky-box-content{padding:var(--sky-padding-even-xl)}\n"], dependencies: [{ kind: "directive", type: i1$1.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }], encapsulation: i0.ViewEncapsulation.None });
711
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBoxComponent, decorators: [{
712
- type: Component,
713
- args: [{ selector: 'sky-box', encapsulation: ViewEncapsulation.None, template: "<section\n class=\"sky-box\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.role]=\"ariaRole\"\n [skyThemeClass]=\"{\n 'sky-shadow sky-border-dark': 'default',\n 'sky-elevation-1-bordered': 'modern'\n }\"\n>\n <div class=\"sky-box-header-content\">\n <ng-content select=\"sky-box-header\"></ng-content>\n <ng-content select=\"sky-box-controls\"></ng-content>\n </div>\n <ng-content></ng-content>\n</section>\n", styles: ["sky-box{--sky-box-border-radius: initial;--sky-box-overflow: initial}.sky-theme-modern sky-box{--sky-box-border-radius: $sky-theme-modern-box-border-radius-default;--sky-box-overflow: hidden}sky-box{display:block}.sky-box{background-color:#fff;border-radius:var(--sky-box-border-radius);overflow:var(--sky-box-overflow)}.sky-box .sky-box-header-content{display:flex;flex-direction:row;flex-wrap:wrap;align-items:baseline;padding:var(--sky-padding-even-xl) var(--sky-padding-even-xl) 0 var(--sky-padding-even-xl)}.sky-box .sky-box-header-content:empty{display:none}.sky-box .sky-box-header-content sky-box-controls{order:1;margin-left:auto}.sky-box .sky-box-header-content sky-box-controls .sky-box-controls{position:relative;top:-2px}.sky-box sky-box-content{flex:0 1 100%;order:2}.sky-box sky-box-content .sky-box-content{padding:var(--sky-padding-even-xl)}\n"] }]
714
- }], propDecorators: { ariaLabel: [{
715
- type: Input
716
- }], ariaLabelledBy: [{
717
- type: Input
718
- }], ariaRole: [{
719
- type: Input
720
- }] } });
721
-
722
- class SkyBoxModule {
723
- }
724
- SkyBoxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
725
- SkyBoxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyBoxModule, declarations: [SkyBoxComponent,
726
- SkyBoxHeaderComponent,
727
- SkyBoxContentComponent,
728
- SkyBoxControlsComponent], imports: [CommonModule, SkyThemeModule, SkyTrimModule], exports: [SkyBoxComponent,
729
- SkyBoxHeaderComponent,
730
- SkyBoxContentComponent,
731
- SkyBoxControlsComponent] });
732
- SkyBoxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBoxModule, imports: [CommonModule, SkyThemeModule, SkyTrimModule] });
733
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyBoxModule, decorators: [{
734
- type: NgModule,
735
- args: [{
736
- declarations: [
737
- SkyBoxComponent,
738
- SkyBoxHeaderComponent,
739
- SkyBoxContentComponent,
740
- SkyBoxControlsComponent,
741
- ],
742
- imports: [CommonModule, SkyThemeModule, SkyTrimModule],
743
- exports: [
744
- SkyBoxComponent,
745
- SkyBoxHeaderComponent,
746
- SkyBoxContentComponent,
747
- SkyBoxControlsComponent,
748
- ],
749
- }]
750
- }] });
751
-
752
- var _SkyInlineDeleteAdapterService_instances, _SkyInlineDeleteAdapterService_element, _SkyInlineDeleteAdapterService_focusableElements, _SkyInlineDeleteAdapterService_parentEl, _SkyInlineDeleteAdapterService_parentElClearListenerFn, _SkyInlineDeleteAdapterService_renderer, _SkyInlineDeleteAdapterService_coreAdapterService, _SkyInlineDeleteAdapterService_focusNextElement, _SkyInlineDeleteAdapterService_getFocusableElements, _SkyInlineDeleteAdapterService_isElementHiddenOrCovered, _SkyInlineDeleteAdapterService_isElementHidden, _SkyInlineDeleteAdapterService_isShift;
753
- /**
754
- * @internal
755
- */
756
- class SkyInlineDeleteAdapterService {
757
- constructor(coreAdapterService, rendererFactory) {
758
- _SkyInlineDeleteAdapterService_instances.add(this);
759
- _SkyInlineDeleteAdapterService_element.set(this, void 0);
760
- _SkyInlineDeleteAdapterService_focusableElements.set(this, void 0);
761
- _SkyInlineDeleteAdapterService_parentEl.set(this, void 0);
762
- _SkyInlineDeleteAdapterService_parentElClearListenerFn.set(this, void 0);
763
- _SkyInlineDeleteAdapterService_renderer.set(this, void 0);
764
- _SkyInlineDeleteAdapterService_coreAdapterService.set(this, void 0);
765
- __classPrivateFieldSet(this, _SkyInlineDeleteAdapterService_coreAdapterService, coreAdapterService, "f");
766
- __classPrivateFieldSet(this, _SkyInlineDeleteAdapterService_renderer, rendererFactory.createRenderer(undefined, null), "f");
767
- }
768
- clearListeners() {
769
- /* istanbul ignore else */
770
- if (__classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_parentElClearListenerFn, "f")) {
771
- __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_parentElClearListenerFn, "f").call(this);
772
- }
773
- }
774
- setEl(element) {
775
- __classPrivateFieldSet(this, _SkyInlineDeleteAdapterService_element, element, "f");
776
- __classPrivateFieldSet(this, _SkyInlineDeleteAdapterService_parentEl, element.parentElement, "f");
777
- /* istanbul ignore else */
778
- if (__classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_parentEl, "f")) {
779
- __classPrivateFieldSet(this, _SkyInlineDeleteAdapterService_parentElClearListenerFn, __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_renderer, "f").listen(__classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_parentEl, "f"), 'focusin', (event) => {
780
- if (__classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_element, "f")) {
781
- const target = event.target;
782
- if (!__classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_element, "f").contains(target) && __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_parentEl, "f") !== target) {
783
- event.preventDefault();
784
- event.stopPropagation();
785
- event.stopImmediatePropagation();
786
- target.blur();
787
- __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_instances, "m", _SkyInlineDeleteAdapterService_focusNextElement).call(this, target, __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_instances, "m", _SkyInlineDeleteAdapterService_isShift).call(this, event));
788
- }
789
- }
790
- }), "f");
791
- }
792
- }
793
- }
794
- _SkyInlineDeleteAdapterService_element = new WeakMap(), _SkyInlineDeleteAdapterService_focusableElements = new WeakMap(), _SkyInlineDeleteAdapterService_parentEl = new WeakMap(), _SkyInlineDeleteAdapterService_parentElClearListenerFn = new WeakMap(), _SkyInlineDeleteAdapterService_renderer = new WeakMap(), _SkyInlineDeleteAdapterService_coreAdapterService = new WeakMap(), _SkyInlineDeleteAdapterService_instances = new WeakSet(), _SkyInlineDeleteAdapterService_focusNextElement = function _SkyInlineDeleteAdapterService_focusNextElement(targetElement, shiftKey) {
795
- const focusable = __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_instances, "m", _SkyInlineDeleteAdapterService_getFocusableElements).call(this);
796
- // If shift tab, go in the other direction
797
- const modifier = shiftKey ? -1 : 1;
798
- // Find the next navigable element that isn't waiting
799
- const startingIndex = focusable.indexOf(targetElement);
800
- let curIndex = startingIndex + modifier;
801
- while (focusable[curIndex] &&
802
- __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_instances, "m", _SkyInlineDeleteAdapterService_isElementHiddenOrCovered).call(this, focusable[curIndex])) {
803
- curIndex += modifier;
804
- }
805
- if (focusable[curIndex] &&
806
- !__classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_instances, "m", _SkyInlineDeleteAdapterService_isElementHiddenOrCovered).call(this, focusable[curIndex])) {
807
- focusable[curIndex].focus();
808
- }
809
- else {
810
- // Try wrapping the navigation
811
- /* istanbul ignore next */
812
- curIndex = modifier > 0 ? 0 : focusable.length - 1;
813
- /* istanbul ignore next */
814
- while (curIndex !== startingIndex &&
815
- focusable[curIndex] &&
816
- __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_instances, "m", _SkyInlineDeleteAdapterService_isElementHiddenOrCovered).call(this, focusable[curIndex])) {
817
- curIndex += modifier;
818
- }
819
- /* istanbul ignore else */
820
- /* sanity check */
821
- if (focusable[curIndex] &&
822
- !__classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_instances, "m", _SkyInlineDeleteAdapterService_isElementHiddenOrCovered).call(this, focusable[curIndex])) {
823
- focusable[curIndex].focus();
824
- }
825
- else {
826
- // No valid target, wipe focus
827
- // This should never happen in practice due to the multiple inline delete buttons
828
- if (document.activeElement && document.activeElement.blur) {
829
- document.activeElement.blur();
830
- }
831
- document.body.focus();
832
- }
833
- }
834
- // clear focusableElements list so that if things change between tabbing we know about it
835
- __classPrivateFieldSet(this, _SkyInlineDeleteAdapterService_focusableElements, undefined, "f");
836
- }, _SkyInlineDeleteAdapterService_getFocusableElements = function _SkyInlineDeleteAdapterService_getFocusableElements() {
837
- // Keep this cached so we can reduce queries
838
- if (__classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_focusableElements, "f")) {
839
- return __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_focusableElements, "f");
840
- }
841
- __classPrivateFieldSet(this, _SkyInlineDeleteAdapterService_focusableElements, __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_coreAdapterService, "f").getFocusableChildren(document.body), "f");
842
- return __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_focusableElements, "f");
843
- }, _SkyInlineDeleteAdapterService_isElementHiddenOrCovered = function _SkyInlineDeleteAdapterService_isElementHiddenOrCovered(element) {
844
- // Check if the element is hidden by css, not within the inline delete, or a wait is covering it
845
- return (__classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_instances, "m", _SkyInlineDeleteAdapterService_isElementHidden).call(this, element) ||
846
- (!!__classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_parentEl, "f") &&
847
- __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_parentEl, "f").contains(element) &&
848
- (!__classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_element, "f")?.contains(element) ||
849
- __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_parentEl, "f").querySelector('.sky-wait-mask') !== null)));
850
- }, _SkyInlineDeleteAdapterService_isElementHidden = function _SkyInlineDeleteAdapterService_isElementHidden(element) {
851
- const style = window.getComputedStyle(element);
852
- return style.display === 'none' || style.visibility === 'hidden';
853
- }, _SkyInlineDeleteAdapterService_isShift = function _SkyInlineDeleteAdapterService_isShift(event) {
854
- // Determine if shift+tab was used based on element order
855
- const elements = __classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_instances, "m", _SkyInlineDeleteAdapterService_getFocusableElements).call(this).filter((elem) => !__classPrivateFieldGet(this, _SkyInlineDeleteAdapterService_instances, "m", _SkyInlineDeleteAdapterService_isElementHidden).call(this, elem));
856
- const previousInd = elements.indexOf(event.relatedTarget);
857
- const currentInd = elements.indexOf(event.target);
858
- /* istanbul ignore next */
859
- return (previousInd === currentInd + 1 ||
860
- (previousInd === 0 && currentInd === elements.length - 1) ||
861
- previousInd > currentInd ||
862
- !event.relatedTarget);
863
- };
864
- SkyInlineDeleteAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyInlineDeleteAdapterService, deps: [{ token: i1$2.SkyCoreAdapterService }, { token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
865
- SkyInlineDeleteAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyInlineDeleteAdapterService });
866
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyInlineDeleteAdapterService, decorators: [{
867
- type: Injectable
868
- }], ctorParameters: function () { return [{ type: i1$2.SkyCoreAdapterService }, { type: i0.RendererFactory2 }]; } });
869
-
870
- /**
871
- * The type of inline delete that is shown.
872
- * @internal
873
- */
874
- var SkyInlineDeleteType;
875
- (function (SkyInlineDeleteType) {
876
- /**
877
- * The standard styling for inline deletes.
878
- */
879
- SkyInlineDeleteType["Standard"] = "standard";
880
- /**
881
- * The styling for inline delete components which are used in card components.
882
- */
883
- SkyInlineDeleteType["Card"] = "card";
884
- })(SkyInlineDeleteType || (SkyInlineDeleteType = {}));
885
-
886
- var _SkyInlineDeleteComponent_adapterService, _SkyInlineDeleteComponent_changeDetector, _SkyInlineDeleteComponent_elRef;
887
- /**
888
- * Auto-incrementing integer used to generate unique ids for inline delete components.
889
- */
890
- let nextId$2 = 0;
891
- class SkyInlineDeleteComponent {
892
- constructor(adapterService, changeDetector, elRef) {
893
- /**
894
- * Whether the deletion is pending.
895
- * @default false
896
- */
897
- this.pending = false;
898
- /**
899
- * Fires when users click the cancel button.
900
- */
901
- this.cancelTriggered = new EventEmitter();
902
- /**
903
- * Fires when users click the delete button.
904
- */
905
- this.deleteTriggered = new EventEmitter();
906
- this.animationState = 'shown';
907
- this.assistiveTextId = `sky-inline-delete-assistive-text-${++nextId$2}`;
908
- this.type = SkyInlineDeleteType.Standard;
909
- _SkyInlineDeleteComponent_adapterService.set(this, void 0);
910
- _SkyInlineDeleteComponent_changeDetector.set(this, void 0);
911
- _SkyInlineDeleteComponent_elRef.set(this, void 0);
912
- __classPrivateFieldSet(this, _SkyInlineDeleteComponent_adapterService, adapterService, "f");
913
- __classPrivateFieldSet(this, _SkyInlineDeleteComponent_changeDetector, changeDetector, "f");
914
- __classPrivateFieldSet(this, _SkyInlineDeleteComponent_elRef, elRef, "f");
915
- }
916
- /**
917
- * Initialization lifecycle hook
918
- * @internal
919
- */
920
- ngOnInit() {
921
- this.animationState = 'shown';
922
- }
923
- /**
924
- * Destruction lifecycle hook
925
- * @internal
926
- */
927
- ngOnDestroy() {
928
- __classPrivateFieldGet(this, _SkyInlineDeleteComponent_adapterService, "f").clearListeners();
929
- this.cancelTriggered.complete();
930
- this.deleteTriggered.complete();
931
- }
932
- /**
933
- * @internal
934
- */
935
- onCancelClick() {
936
- this.animationState = 'hidden';
937
- }
938
- /**
939
- * @internal
940
- */
941
- onDeleteClick() {
942
- this.deleteTriggered.emit();
943
- }
944
- /**
945
- * Sets the inline delete to one of its predefined types.
946
- * @param type The inline delete type
947
- * @internal
948
- */
949
- setType(type) {
950
- this.type = type;
951
- __classPrivateFieldGet(this, _SkyInlineDeleteComponent_changeDetector, "f").detectChanges();
952
- }
953
- /**
954
- * Handles actions that should be taken after the inline delete animates
955
- * @param event The animation event
956
- * @internal
957
- */
958
- onAnimationDone(event) {
959
- if (event.toState === 'hidden') {
960
- this.cancelTriggered.emit();
961
- }
962
- else {
963
- this.deleteButton?.nativeElement.focus();
964
- /* istanbul ignore else */
965
- if (__classPrivateFieldGet(this, _SkyInlineDeleteComponent_elRef, "f")) {
966
- __classPrivateFieldGet(this, _SkyInlineDeleteComponent_adapterService, "f").setEl(__classPrivateFieldGet(this, _SkyInlineDeleteComponent_elRef, "f").nativeElement);
967
- }
968
- }
969
- }
970
- }
971
- _SkyInlineDeleteComponent_adapterService = new WeakMap(), _SkyInlineDeleteComponent_changeDetector = new WeakMap(), _SkyInlineDeleteComponent_elRef = new WeakMap();
972
- SkyInlineDeleteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyInlineDeleteComponent, deps: [{ token: SkyInlineDeleteAdapterService }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
973
- SkyInlineDeleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyInlineDeleteComponent, selector: "sky-inline-delete", inputs: { pending: "pending" }, outputs: { cancelTriggered: "cancelTriggered", deleteTriggered: "deleteTriggered" }, providers: [SkyCoreAdapterService, SkyInlineDeleteAdapterService], viewQueries: [{ propertyName: "deleteButton", first: true, predicate: ["delete"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n class=\"sky-inline-delete sky-inline-delete-{{ type }}\"\n role=\"alertdialog\"\n [@inlineDeleteAnimation]=\"animationState\"\n (@inlineDeleteAnimation.done)=\"onAnimationDone($event)\"\n [attr.aria-describedby]=\"assistiveTextId\"\n [attr.aria-label]=\"'skyux_inline_delete_confirm_deletion' | skyLibResources\"\n>\n <span class=\"sky-inline-delete-assistive-text\" [id]=\"assistiveTextId\">\n {{ 'skyux_inline_delete_assistive_text' | skyLibResources }}\n </span>\n <sky-wait class=\"sky-inline-delete-wait\" [isWaiting]=\"pending\"></sky-wait>\n <div class=\"sky-inline-delete-content\">\n <div class=\"sky-inline-delete-content-animation-container\">\n <button\n class=\"sky-btn sky-btn-danger sky-inline-delete-button\"\n type=\"button\"\n (click)=\"onDeleteClick()\"\n #delete\n >\n {{ 'skyux_inline_delete_delete' | skyLibResources }}\n </button>\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onCancelClick()\"\n >\n {{ 'skyux_inline_delete_cancel' | skyLibResources }}\n </button>\n </div>\n </div>\n</div>\n", styles: [".sky-inline-delete{position:absolute!important;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:999;border:2px solid #ef4044}.sky-inline-delete-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-inline-delete-button{margin-right:10px}.sky-inline-delete-card .sky-inline-delete-content{position:absolute;bottom:10px;text-align:center;width:100%}.sky-inline-delete-standard .sky-inline-delete-content{position:absolute;top:50%;transform:translateY(-50%);left:20px}.sky-inline-delete-wait{height:100%}\n"], dependencies: [{ kind: "component", type: i2$1.λ14, selector: "sky-wait", inputs: ["ariaLabel", "isWaiting", "isFullPage", "isNonBlocking", "screenReaderCompletedText"] }, { kind: "pipe", type: i1$3.SkyLibResourcesPipe, name: "skyLibResources" }], animations: [
974
- trigger('inlineDeleteAnimation', [
975
- transition('* => shown', [
976
- style({
977
- opacity: 0,
978
- }),
979
- query('.sky-inline-delete-content-animation-container', style({ transform: 'scale(0.0)' })),
980
- group([
981
- animate('300ms ease-in-out', style({ opacity: 1 })),
982
- query('.sky-inline-delete-content-animation-container', animate('300ms ease-in-out', style({
983
- transform: 'scale(1)',
984
- }))),
985
- ]),
986
- ]),
987
- transition(`shown <=> *`, [
988
- query('.sky-inline-delete-content-animation-container', style({ transform: 'scale(1)' })),
989
- group([
990
- animate('300ms ease-in-out', style({
991
- opacity: 0,
992
- })),
993
- query('.sky-inline-delete-content-animation-container', animate('300ms ease-in-out', style({
994
- transform: 'scale(0.0)',
995
- }))),
996
- ]),
997
- ]),
998
- ]),
999
- ] });
1000
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyInlineDeleteComponent, decorators: [{
1001
- type: Component,
1002
- args: [{ selector: 'sky-inline-delete', animations: [
1003
- trigger('inlineDeleteAnimation', [
1004
- transition('* => shown', [
1005
- style({
1006
- opacity: 0,
1007
- }),
1008
- query('.sky-inline-delete-content-animation-container', style({ transform: 'scale(0.0)' })),
1009
- group([
1010
- animate('300ms ease-in-out', style({ opacity: 1 })),
1011
- query('.sky-inline-delete-content-animation-container', animate('300ms ease-in-out', style({
1012
- transform: 'scale(1)',
1013
- }))),
1014
- ]),
1015
- ]),
1016
- transition(`shown <=> *`, [
1017
- query('.sky-inline-delete-content-animation-container', style({ transform: 'scale(1)' })),
1018
- group([
1019
- animate('300ms ease-in-out', style({
1020
- opacity: 0,
1021
- })),
1022
- query('.sky-inline-delete-content-animation-container', animate('300ms ease-in-out', style({
1023
- transform: 'scale(0.0)',
1024
- }))),
1025
- ]),
1026
- ]),
1027
- ]),
1028
- ], providers: [SkyCoreAdapterService, SkyInlineDeleteAdapterService], template: "<div\n class=\"sky-inline-delete sky-inline-delete-{{ type }}\"\n role=\"alertdialog\"\n [@inlineDeleteAnimation]=\"animationState\"\n (@inlineDeleteAnimation.done)=\"onAnimationDone($event)\"\n [attr.aria-describedby]=\"assistiveTextId\"\n [attr.aria-label]=\"'skyux_inline_delete_confirm_deletion' | skyLibResources\"\n>\n <span class=\"sky-inline-delete-assistive-text\" [id]=\"assistiveTextId\">\n {{ 'skyux_inline_delete_assistive_text' | skyLibResources }}\n </span>\n <sky-wait class=\"sky-inline-delete-wait\" [isWaiting]=\"pending\"></sky-wait>\n <div class=\"sky-inline-delete-content\">\n <div class=\"sky-inline-delete-content-animation-container\">\n <button\n class=\"sky-btn sky-btn-danger sky-inline-delete-button\"\n type=\"button\"\n (click)=\"onDeleteClick()\"\n #delete\n >\n {{ 'skyux_inline_delete_delete' | skyLibResources }}\n </button>\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onCancelClick()\"\n >\n {{ 'skyux_inline_delete_cancel' | skyLibResources }}\n </button>\n </div>\n </div>\n</div>\n", styles: [".sky-inline-delete{position:absolute!important;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:999;border:2px solid #ef4044}.sky-inline-delete-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-inline-delete-button{margin-right:10px}.sky-inline-delete-card .sky-inline-delete-content{position:absolute;bottom:10px;text-align:center;width:100%}.sky-inline-delete-standard .sky-inline-delete-content{position:absolute;top:50%;transform:translateY(-50%);left:20px}.sky-inline-delete-wait{height:100%}\n"] }]
1029
- }], ctorParameters: function () { return [{ type: SkyInlineDeleteAdapterService }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, propDecorators: { pending: [{
1030
- type: Input
1031
- }], cancelTriggered: [{
1032
- type: Output
1033
- }], deleteTriggered: [{
1034
- type: Output
1035
- }], deleteButton: [{
1036
- type: ViewChild,
1037
- args: ['delete', {
1038
- read: ElementRef,
1039
- static: false,
1040
- }]
1041
- }] } });
1042
-
1043
- class SkyInlineDeleteModule {
1044
- }
1045
- SkyInlineDeleteModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyInlineDeleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1046
- SkyInlineDeleteModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyInlineDeleteModule, declarations: [SkyInlineDeleteComponent], imports: [CommonModule,
1047
- SkyI18nModule,
1048
- SkyLayoutResourcesModule,
1049
- SkyWaitModule], exports: [SkyInlineDeleteComponent] });
1050
- SkyInlineDeleteModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyInlineDeleteModule, imports: [CommonModule,
1051
- SkyI18nModule,
1052
- SkyLayoutResourcesModule,
1053
- SkyWaitModule] });
1054
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyInlineDeleteModule, decorators: [{
1055
- type: NgModule,
1056
- args: [{
1057
- declarations: [SkyInlineDeleteComponent],
1058
- imports: [
1059
- CommonModule,
1060
- SkyI18nModule,
1061
- SkyLayoutResourcesModule,
1062
- SkyWaitModule,
1063
- ],
1064
- exports: [SkyInlineDeleteComponent],
1065
- }]
1066
- }] });
1067
-
1068
- /**
1069
- * Specifies an action that users can perform on the card.
1070
- * @deprecated
1071
- */
1072
- class SkyCardActionsComponent {
1073
- }
1074
- SkyCardActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyCardActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1075
- SkyCardActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyCardActionsComponent, selector: "sky-card-actions", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:block;border-top:1px solid #e2e3e4;padding:7px 0}\n"] });
1076
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyCardActionsComponent, decorators: [{
1077
- type: Component,
1078
- args: [{ selector: 'sky-card-actions', template: "<ng-content></ng-content>\n", styles: [":host{display:block;border-top:1px solid #e2e3e4;padding:7px 0}\n"] }]
1079
- }] });
1080
-
1081
- /**
1082
- * Specifies the content to display in the body of the card.
1083
- * @deprecated
1084
- */
1085
- class SkyCardContentComponent {
1086
- }
1087
- SkyCardContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyCardContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1088
- SkyCardContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyCardContentComponent, selector: "sky-card-content", ngImport: i0, template: "<ng-content></ng-content>\n" });
1089
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyCardContentComponent, decorators: [{
1090
- type: Component,
1091
- args: [{ selector: 'sky-card-content', template: "<ng-content></ng-content>\n" }]
1092
- }] });
1093
-
1094
- /**
1095
- * Specifies a title to identify what the card represents.
1096
- * @deprecated
1097
- */
1098
- class SkyCardTitleComponent {
1099
- }
1100
- SkyCardTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyCardTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1101
- SkyCardTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyCardTitleComponent, selector: "sky-card-title", ngImport: i0, template: "<ng-content></ng-content>\n" });
1102
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyCardTitleComponent, decorators: [{
1103
- type: Component,
1104
- args: [{ selector: 'sky-card-title', template: "<ng-content></ng-content>\n" }]
1105
- }] });
1106
-
1107
- var _SkyCardComponent_subscription, _SkyCardComponent__size;
1108
- /**
1109
- * Creates a a small container to highlight important information.
1110
- * @deprecated `SkyCardComponent` is deprecated. For other SKY UX components that group and list content, see the content containers guidelines. For more information, see https://developer.blackbaud.com/skyux/design/guidelines/content-containers.
1111
- */
1112
- class SkyCardComponent {
1113
- /**
1114
- * The size of the card. The valid options are `"large"` and `"small"`.
1115
- * @default "large"
1116
- */
1117
- set size(value) {
1118
- __classPrivateFieldSet(this, _SkyCardComponent__size, value ?? 'large', "f");
1119
- }
1120
- get size() {
1121
- return __classPrivateFieldGet(this, _SkyCardComponent__size, "f");
1122
- }
1123
- constructor(logger) {
1124
- /**
1125
- * Whether to display a checkbox to the right of the card title.
1126
- * Users can select multiple checkboxes and perform actions on the selected cards.
1127
- * @default false
1128
- */
1129
- this.selectable = false;
1130
- /**
1131
- * Whether the card is selected. This only applies to card where
1132
- * `selectable` is set to `true`.
1133
- * @default false
1134
- */
1135
- this.selected = false;
1136
- /**
1137
- * Fires when users select or deselect the card.
1138
- */
1139
- this.selectedChange = new EventEmitter();
1140
- this.showTitle = true;
1141
- _SkyCardComponent_subscription.set(this, void 0);
1142
- _SkyCardComponent__size.set(this, 'large');
1143
- logger.deprecated('SkyCardComponent', {
1144
- deprecationMajorVersion: 6,
1145
- moreInfoUrl: 'https://developer.blackbaud.com/skyux/design/guidelines/content-containers',
1146
- replacementRecommendation: 'For other SKY UX components that group and list content, see the content containers guidelines.',
1147
- });
1148
- }
1149
- ngAfterContentInit() {
1150
- this.showTitle = !!this.titleComponent && this.titleComponent.length > 0;
1151
- __classPrivateFieldSet(this, _SkyCardComponent_subscription, this.titleComponent?.changes.subscribe(() => {
1152
- this.showTitle = !!this.titleComponent && this.titleComponent.length > 0;
1153
- }), "f");
1154
- this.inlineDeleteComponent?.forEach((item) => {
1155
- item.setType(SkyInlineDeleteType.Card);
1156
- });
1157
- this.inlineDeleteComponent?.changes.subscribe(() => {
1158
- this.inlineDeleteComponent?.forEach((item) => {
1159
- item.setType(SkyInlineDeleteType.Card);
1160
- });
1161
- });
1162
- }
1163
- contentClick() {
1164
- if (this.selectable) {
1165
- this.selected = !this.selected;
1166
- this.selectedChange.emit(this.selected);
1167
- }
1168
- }
1169
- onCheckboxChange(newValue) {
1170
- if (this.selectable && this.selected !== newValue) {
1171
- this.selected = newValue;
1172
- this.selectedChange.emit(this.selected);
1173
- }
1174
- }
1175
- ngOnDestroy() {
1176
- /* istanbul ignore else */
1177
- /* sanity check */
1178
- if (__classPrivateFieldGet(this, _SkyCardComponent_subscription, "f")) {
1179
- __classPrivateFieldGet(this, _SkyCardComponent_subscription, "f").unsubscribe();
1180
- }
1181
- }
1182
- }
1183
- _SkyCardComponent_subscription = new WeakMap(), _SkyCardComponent__size = new WeakMap();
1184
- SkyCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyCardComponent, deps: [{ token: i1$2.SkyLogService }], target: i0.ɵɵFactoryTarget.Component });
1185
- SkyCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyCardComponent, selector: "sky-card", inputs: { size: "size", selectable: "selectable", selected: "selected" }, outputs: { selectedChange: "selectedChange" }, queries: [{ propertyName: "inlineDeleteComponent", predicate: SkyInlineDeleteComponent }, { propertyName: "titleComponent", predicate: SkyCardTitleComponent }], ngImport: i0, template: "<section\n class=\"sky-card sky-shadow\"\n [ngClass]=\"\n {\n 'sky-card-small': size === 'small',\n 'sky-card-selectable': selectable,\n 'sky-card-selected': selectable &amp;&amp; selected\n }\"\n>\n <ng-content select=\"sky-inline-delete\"></ng-content>\n <header>\n <div\n *ngIf=\"selectable || showTitle\"\n class=\"sky-card-header\"\n (click)=\"contentClick()\"\n >\n <div class=\"sky-card-heading-middle\">\n <h1 *ngIf=\"showTitle\" class=\"sky-card-title sky-section-heading\">\n <ng-content select=\"sky-card-title\"></ng-content>\n </h1>\n </div>\n <div *ngIf=\"selectable\" class=\"sky-card-check\">\n <sky-checkbox\n [label]=\"'skyux_card_checkbox_label' | skyLibResources\"\n [ngModel]=\"selected\"\n (click)=\"$event.stopPropagation()\"\n (ngModelChange)=\"onCheckboxChange($event)\"\n ></sky-checkbox>\n </div>\n </div>\n </header>\n <div\n class=\"sky-card-content sky-padding-even-default\"\n (click)=\"contentClick()\"\n >\n <ng-content select=\"sky-card-content\"></ng-content>\n </div>\n <div\n class=\"sky-card-actions\"\n [hidden]=\"actionsEl.children.length === 0\"\n #actionsEl\n >\n <ng-content select=\"sky-card-actions\"></ng-content>\n </div>\n</section>\n", styles: [".sky-card{background-color:#fff;border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;border-right:1px solid #cdcfd2;display:inline-flex;flex-direction:column;height:350px;margin:0 10px 10px 0;transition:background-color .15s;vertical-align:top;width:350px;position:relative}.sky-card-small{height:250px;width:225px}.sky-card-selectable .sky-card-header,.sky-card-selectable .sky-card-content{cursor:pointer}.sky-card-selected{background-color:#f1eef6;transition:background-color .15s}.sky-card-header{align-items:center;display:flex;flex-shrink:0;margin:0;padding:10px 0 0}.sky-card-heading-left,.sky-card-heading-right{font-weight:400;max-width:34px}.sky-card-heading-left{padding-left:10px}.sky-card-heading-right{padding-right:10px}.sky-card-heading-middle{flex-grow:1;padding:0 10px;overflow:hidden}.sky-card-title{margin:0;line-height:1.428571429}.sky-card-check{flex-shrink:0;padding-right:10px}.sky-card-check .sky-check-wrapper{margin-bottom:2px}.sky-card-content{flex-grow:1;font-weight:400;margin:0;overflow:hidden}.sky-card-actions{bottom:0;flex-shrink:0;text-align:center}.sky-card-actions .sky-context-menu-btn{height:32px;width:32px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "icon", "checkboxType", "checked", "indeterminate", "required"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "pipe", type: i1$3.SkyLibResourcesPipe, name: "skyLibResources" }] });
1186
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyCardComponent, decorators: [{
1187
- type: Component,
1188
- args: [{ selector: 'sky-card', template: "<section\n class=\"sky-card sky-shadow\"\n [ngClass]=\"\n {\n 'sky-card-small': size === 'small',\n 'sky-card-selectable': selectable,\n 'sky-card-selected': selectable &amp;&amp; selected\n }\"\n>\n <ng-content select=\"sky-inline-delete\"></ng-content>\n <header>\n <div\n *ngIf=\"selectable || showTitle\"\n class=\"sky-card-header\"\n (click)=\"contentClick()\"\n >\n <div class=\"sky-card-heading-middle\">\n <h1 *ngIf=\"showTitle\" class=\"sky-card-title sky-section-heading\">\n <ng-content select=\"sky-card-title\"></ng-content>\n </h1>\n </div>\n <div *ngIf=\"selectable\" class=\"sky-card-check\">\n <sky-checkbox\n [label]=\"'skyux_card_checkbox_label' | skyLibResources\"\n [ngModel]=\"selected\"\n (click)=\"$event.stopPropagation()\"\n (ngModelChange)=\"onCheckboxChange($event)\"\n ></sky-checkbox>\n </div>\n </div>\n </header>\n <div\n class=\"sky-card-content sky-padding-even-default\"\n (click)=\"contentClick()\"\n >\n <ng-content select=\"sky-card-content\"></ng-content>\n </div>\n <div\n class=\"sky-card-actions\"\n [hidden]=\"actionsEl.children.length === 0\"\n #actionsEl\n >\n <ng-content select=\"sky-card-actions\"></ng-content>\n </div>\n</section>\n", styles: [".sky-card{background-color:#fff;border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;border-left:1px solid #cdcfd2;border-right:1px solid #cdcfd2;display:inline-flex;flex-direction:column;height:350px;margin:0 10px 10px 0;transition:background-color .15s;vertical-align:top;width:350px;position:relative}.sky-card-small{height:250px;width:225px}.sky-card-selectable .sky-card-header,.sky-card-selectable .sky-card-content{cursor:pointer}.sky-card-selected{background-color:#f1eef6;transition:background-color .15s}.sky-card-header{align-items:center;display:flex;flex-shrink:0;margin:0;padding:10px 0 0}.sky-card-heading-left,.sky-card-heading-right{font-weight:400;max-width:34px}.sky-card-heading-left{padding-left:10px}.sky-card-heading-right{padding-right:10px}.sky-card-heading-middle{flex-grow:1;padding:0 10px;overflow:hidden}.sky-card-title{margin:0;line-height:1.428571429}.sky-card-check{flex-shrink:0;padding-right:10px}.sky-card-check .sky-check-wrapper{margin-bottom:2px}.sky-card-content{flex-grow:1;font-weight:400;margin:0;overflow:hidden}.sky-card-actions{bottom:0;flex-shrink:0;text-align:center}.sky-card-actions .sky-context-menu-btn{height:32px;width:32px}\n"] }]
1189
- }], ctorParameters: function () { return [{ type: i1$2.SkyLogService }]; }, propDecorators: { size: [{
1190
- type: Input
1191
- }], selectable: [{
1192
- type: Input
1193
- }], selected: [{
1194
- type: Input
1195
- }], selectedChange: [{
1196
- type: Output
1197
- }], inlineDeleteComponent: [{
1198
- type: ContentChildren,
1199
- args: [SkyInlineDeleteComponent]
1200
- }], titleComponent: [{
1201
- type: ContentChildren,
1202
- args: [SkyCardTitleComponent]
1203
- }] } });
1204
-
1205
- /**
1206
- * @deprecated `SkyCardModule` is deprecated. For other SKY UX components that group and list content, see the content containers guidelines. For more information, see https://developer.blackbaud.com/skyux/design/guidelines/content-containers.
1207
- */
1208
- class SkyCardModule {
1209
- }
1210
- SkyCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1211
- SkyCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyCardModule, declarations: [SkyCardActionsComponent,
1212
- SkyCardComponent,
1213
- SkyCardContentComponent,
1214
- SkyCardTitleComponent], imports: [CommonModule,
1215
- FormsModule,
1216
- SkyCheckboxModule,
1217
- SkyI18nModule,
1218
- SkyLayoutResourcesModule,
1219
- SkyInlineDeleteModule], exports: [SkyCardActionsComponent,
1220
- SkyCardComponent,
1221
- SkyCardContentComponent,
1222
- SkyCardTitleComponent] });
1223
- SkyCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyCardModule, imports: [CommonModule,
1224
- FormsModule,
1225
- SkyCheckboxModule,
1226
- SkyI18nModule,
1227
- SkyLayoutResourcesModule,
1228
- SkyInlineDeleteModule] });
1229
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyCardModule, decorators: [{
1230
- type: NgModule,
1231
- args: [{
1232
- declarations: [
1233
- SkyCardActionsComponent,
1234
- SkyCardComponent,
1235
- SkyCardContentComponent,
1236
- SkyCardTitleComponent,
1237
- ],
1238
- imports: [
1239
- CommonModule,
1240
- FormsModule,
1241
- SkyCheckboxModule,
1242
- SkyI18nModule,
1243
- SkyLayoutResourcesModule,
1244
- SkyInlineDeleteModule,
1245
- ],
1246
- exports: [
1247
- SkyCardActionsComponent,
1248
- SkyCardComponent,
1249
- SkyCardContentComponent,
1250
- SkyCardTitleComponent,
1251
- ],
1252
- }]
1253
- }] });
1254
-
1255
- /**
1256
- * Wraps the label-value pairs in the definition list.
1257
- */
1258
- class SkyDefinitionListContentComponent {
1259
- }
1260
- SkyDefinitionListContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1261
- SkyDefinitionListContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyDefinitionListContentComponent, selector: "sky-definition-list-content", ngImport: i0, template: "<div class=\"sky-definition-list-content\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-definition-list-content{display:flex;flex-wrap:wrap;margin-bottom:5px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1262
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListContentComponent, decorators: [{
1263
- type: Component,
1264
- args: [{ selector: 'sky-definition-list-content', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-definition-list-content\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-definition-list-content{display:flex;flex-wrap:wrap;margin-bottom:5px}\n"] }]
1265
- }] });
1266
-
1267
- /**
1268
- * Specifies a title for the definition list.
1269
- */
1270
- class SkyDefinitionListHeadingComponent {
1271
- }
1272
- SkyDefinitionListHeadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListHeadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1273
- SkyDefinitionListHeadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyDefinitionListHeadingComponent, selector: "sky-definition-list-heading", ngImport: i0, template: "<div class=\"sky-subsection-heading sky-definition-list-heading\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-definition-list-heading{margin-bottom:5px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1274
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListHeadingComponent, decorators: [{
1275
- type: Component,
1276
- args: [{ selector: 'sky-definition-list-heading', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-subsection-heading sky-definition-list-heading\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-definition-list-heading{margin-bottom:5px}\n"] }]
1277
- }] });
1278
-
1279
- /**
1280
- * @internal
1281
- */
1282
- class SkyDefinitionListService {
1283
- constructor() {
1284
- this.labelWidth = new BehaviorSubject('');
1285
- this.defaultValue = new BehaviorSubject('');
1286
- }
1287
- }
1288
- SkyDefinitionListService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
1289
- SkyDefinitionListService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListService });
1290
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListService, decorators: [{
1291
- type: Injectable
1292
- }] });
1293
-
1294
- /**
1295
- * Specifies the label in a label-value pair.
1296
- */
1297
- class SkyDefinitionListLabelComponent {
1298
- constructor(service) {
1299
- this.service = service;
1300
- }
1301
- }
1302
- SkyDefinitionListLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListLabelComponent, deps: [{ token: SkyDefinitionListService }], target: i0.ɵɵFactoryTarget.Component });
1303
- SkyDefinitionListLabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyDefinitionListLabelComponent, selector: "sky-definition-list-label", ngImport: i0, template: "<div\n class=\"sky-field-label sky-definition-list-label\"\n [ngStyle]=\"{\n width: (service.labelWidth | async) || ''\n }\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [":host{flex:0 0 90px}.sky-definition-list-label{margin-right:10px;word-wrap:break-word}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1304
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListLabelComponent, decorators: [{
1305
- type: Component,
1306
- args: [{ selector: 'sky-definition-list-label', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"sky-field-label sky-definition-list-label\"\n [ngStyle]=\"{\n width: (service.labelWidth | async) || ''\n }\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [":host{flex:0 0 90px}.sky-definition-list-label{margin-right:10px;word-wrap:break-word}\n"] }]
1307
- }], ctorParameters: function () { return [{ type: SkyDefinitionListService }]; } });
1308
-
1309
- /**
1310
- * Specifies the value in a label-value pair.
1311
- */
1312
- class SkyDefinitionListValueComponent {
1313
- constructor(service) {
1314
- this.service = service;
1315
- }
1316
- }
1317
- SkyDefinitionListValueComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListValueComponent, deps: [{ token: SkyDefinitionListService }], target: i0.ɵɵFactoryTarget.Component });
1318
- SkyDefinitionListValueComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyDefinitionListValueComponent, selector: "sky-definition-list-value", ngImport: i0, template: "<div class=\"sky-definition-list-value\">\n <span #valueEl>\n <ng-content></ng-content>\n </span>\n <span class=\"sky-deemphasized\" *ngIf=\"!valueEl.textContent?.trim()\">\n {{\n (service.defaultValue | async) ||\n ('skyux_definition_list_none_found' | skyLibResources)\n }}\n </span>\n</div>\n", styles: [":host{flex:1}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$3.SkyLibResourcesPipe, name: "skyLibResources" }] });
1319
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListValueComponent, decorators: [{
1320
- type: Component,
1321
- args: [{ selector: 'sky-definition-list-value', template: "<div class=\"sky-definition-list-value\">\n <span #valueEl>\n <ng-content></ng-content>\n </span>\n <span class=\"sky-deemphasized\" *ngIf=\"!valueEl.textContent?.trim()\">\n {{\n (service.defaultValue | async) ||\n ('skyux_definition_list_none_found' | skyLibResources)\n }}\n </span>\n</div>\n", styles: [":host{flex:1}\n"] }]
1322
- }], ctorParameters: function () { return [{ type: SkyDefinitionListService }]; } });
1323
-
1324
- /**
1325
- * Creates a definition list to display label-value pairs.
1326
- */
1327
- class SkyDefinitionListComponent {
1328
- /**
1329
- * The width of the label portion of the definition list.
1330
- * @default "90px"
1331
- */
1332
- set labelWidth(value) {
1333
- this.service.labelWidth.next(value);
1334
- }
1335
- /**
1336
- * The default value to display when no value is provided
1337
- * for a label-value pair.
1338
- * @default "None found"
1339
- */
1340
- set defaultValue(value) {
1341
- this.service.defaultValue.next(value);
1342
- }
1343
- constructor(service, logger) {
1344
- this.service = service;
1345
- logger.deprecated('SkyDefinitionListComponent', {
1346
- deprecationMajorVersion: 6,
1347
- moreInfoUrl: 'https://developer.blackbaud.com/skyux/components/description-list',
1348
- replacementRecommendation: 'Use `SkyDescriptionListComponent` instead.',
1349
- });
1350
- }
1351
- }
1352
- SkyDefinitionListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListComponent, deps: [{ token: SkyDefinitionListService }, { token: i1$2.SkyLogService }], target: i0.ɵɵFactoryTarget.Component });
1353
- SkyDefinitionListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyDefinitionListComponent, selector: "sky-definition-list", inputs: { labelWidth: "labelWidth", defaultValue: "defaultValue" }, providers: [SkyDefinitionListService], ngImport: i0, template: "<div class=\"sky-definition-list\">\n <ng-content select=\"sky-definition-list-heading\"></ng-content>\n <ng-content select=\"sky-definition-list-content\"></ng-content>\n</div>\n", styles: [".sky-definition-list{margin-right:50px;margin-bottom:20px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1354
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListComponent, decorators: [{
1355
- type: Component,
1356
- args: [{ selector: 'sky-definition-list', providers: [SkyDefinitionListService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-definition-list\">\n <ng-content select=\"sky-definition-list-heading\"></ng-content>\n <ng-content select=\"sky-definition-list-content\"></ng-content>\n</div>\n", styles: [".sky-definition-list{margin-right:50px;margin-bottom:20px}\n"] }]
1357
- }], ctorParameters: function () { return [{ type: SkyDefinitionListService }, { type: i1$2.SkyLogService }]; }, propDecorators: { labelWidth: [{
1358
- type: Input
1359
- }], defaultValue: [{
1360
- type: Input
1361
- }] } });
1362
-
1363
- /**
1364
- * @deprecated Use `SkyDescriptionListModule` instead.
1365
- */
1366
- class SkyDefinitionListModule {
1367
- }
1368
- SkyDefinitionListModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1369
- SkyDefinitionListModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListModule, declarations: [SkyDefinitionListComponent,
1370
- SkyDefinitionListContentComponent,
1371
- SkyDefinitionListHeadingComponent,
1372
- SkyDefinitionListLabelComponent,
1373
- SkyDefinitionListValueComponent], imports: [CommonModule, SkyI18nModule, SkyLayoutResourcesModule], exports: [SkyDefinitionListComponent,
1374
- SkyDefinitionListContentComponent,
1375
- SkyDefinitionListHeadingComponent,
1376
- SkyDefinitionListLabelComponent,
1377
- SkyDefinitionListValueComponent] });
1378
- SkyDefinitionListModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListModule, imports: [CommonModule, SkyI18nModule, SkyLayoutResourcesModule] });
1379
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDefinitionListModule, decorators: [{
1380
- type: NgModule,
1381
- args: [{
1382
- declarations: [
1383
- SkyDefinitionListComponent,
1384
- SkyDefinitionListContentComponent,
1385
- SkyDefinitionListHeadingComponent,
1386
- SkyDefinitionListLabelComponent,
1387
- SkyDefinitionListValueComponent,
1388
- ],
1389
- imports: [CommonModule, SkyI18nModule, SkyLayoutResourcesModule],
1390
- exports: [
1391
- SkyDefinitionListComponent,
1392
- SkyDefinitionListContentComponent,
1393
- SkyDefinitionListHeadingComponent,
1394
- SkyDefinitionListLabelComponent,
1395
- SkyDefinitionListValueComponent,
1396
- ],
1397
- }]
1398
- }] });
1399
-
1400
- var _SkyDescriptionListService__defaultDescription;
1401
- /**
1402
- * @internal
1403
- */
1404
- class SkyDescriptionListService {
1405
- constructor() {
1406
- _SkyDescriptionListService__defaultDescription.set(this, new BehaviorSubject(''));
1407
- }
1408
- get defaultDescription() {
1409
- return __classPrivateFieldGet(this, _SkyDescriptionListService__defaultDescription, "f").asObservable();
1410
- }
1411
- ngOnDestroy() {
1412
- __classPrivateFieldGet(this, _SkyDescriptionListService__defaultDescription, "f").complete();
1413
- }
1414
- updateDefaultDescription(value) {
1415
- __classPrivateFieldGet(this, _SkyDescriptionListService__defaultDescription, "f").next(value);
1416
- }
1417
- }
1418
- _SkyDescriptionListService__defaultDescription = new WeakMap();
1419
- SkyDescriptionListService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
1420
- SkyDescriptionListService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListService });
1421
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListService, decorators: [{
1422
- type: Injectable
1423
- }] });
1424
-
1425
- var _SkyDescriptionListDescriptionComponent_changeDetector, _SkyDescriptionListDescriptionComponent_ngUnsubscribe, _SkyDescriptionListDescriptionComponent_themeSvc;
1426
- /**
1427
- * Specifies the description in a term-description pair.
1428
- */
1429
- class SkyDescriptionListDescriptionComponent {
1430
- constructor(service, changeDetector, themeSvc) {
1431
- this.service = service;
1432
- _SkyDescriptionListDescriptionComponent_changeDetector.set(this, void 0);
1433
- _SkyDescriptionListDescriptionComponent_ngUnsubscribe.set(this, new Subject());
1434
- _SkyDescriptionListDescriptionComponent_themeSvc.set(this, void 0);
1435
- __classPrivateFieldSet(this, _SkyDescriptionListDescriptionComponent_changeDetector, changeDetector, "f");
1436
- __classPrivateFieldSet(this, _SkyDescriptionListDescriptionComponent_themeSvc, themeSvc, "f");
1437
- }
1438
- ngOnInit() {
1439
- /* istanbul ignore else */
1440
- if (__classPrivateFieldGet(this, _SkyDescriptionListDescriptionComponent_themeSvc, "f")) {
1441
- __classPrivateFieldGet(this, _SkyDescriptionListDescriptionComponent_themeSvc, "f").settingsChange
1442
- .pipe(takeUntil(__classPrivateFieldGet(this, _SkyDescriptionListDescriptionComponent_ngUnsubscribe, "f")))
1443
- .subscribe((themeSettings) => {
1444
- this.themeName = themeSettings.currentSettings.theme.name;
1445
- __classPrivateFieldGet(this, _SkyDescriptionListDescriptionComponent_changeDetector, "f").markForCheck();
1446
- });
1447
- }
1448
- }
1449
- ngOnDestroy() {
1450
- __classPrivateFieldGet(this, _SkyDescriptionListDescriptionComponent_ngUnsubscribe, "f").next();
1451
- __classPrivateFieldGet(this, _SkyDescriptionListDescriptionComponent_ngUnsubscribe, "f").complete();
1452
- }
1453
- }
1454
- _SkyDescriptionListDescriptionComponent_changeDetector = new WeakMap(), _SkyDescriptionListDescriptionComponent_ngUnsubscribe = new WeakMap(), _SkyDescriptionListDescriptionComponent_themeSvc = new WeakMap();
1455
- SkyDescriptionListDescriptionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListDescriptionComponent, deps: [{ token: SkyDescriptionListService }, { token: i0.ChangeDetectorRef }, { token: i1$1.SkyThemeService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1456
- SkyDescriptionListDescriptionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyDescriptionListDescriptionComponent, selector: "sky-description-list-description", viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["descriptionTemplateRef"], descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<ng-template #descriptionTemplateRef>\n <span skyTrim class=\"sky-description-list-description\"\n ><ng-content></ng-content\n ></span>\n <span\n class=\"sky-description-list-default-value\"\n data-sky-id=\"sky-description-list-default-value\"\n [skyThemeClass]=\"{\n 'sky-font-deemphasized': 'modern',\n 'sky-deemphasized': 'default'\n }\"\n >\n {{\n (service.defaultDescription | async) ||\n ('skyux_description_list_none_found' | skyLibResources)\n }}\n </span>\n</ng-template>\n", styles: [".sky-description-list-description:not(:empty)+.sky-description-list-default-value{display:none}\n"], dependencies: [{ kind: "directive", type: i1$1.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "directive", type: i1$2.λ4, selector: "[skyTrim]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1457
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListDescriptionComponent, decorators: [{
1458
- type: Component,
1459
- args: [{ selector: 'sky-description-list-description', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #descriptionTemplateRef>\n <span skyTrim class=\"sky-description-list-description\"\n ><ng-content></ng-content\n ></span>\n <span\n class=\"sky-description-list-default-value\"\n data-sky-id=\"sky-description-list-default-value\"\n [skyThemeClass]=\"{\n 'sky-font-deemphasized': 'modern',\n 'sky-deemphasized': 'default'\n }\"\n >\n {{\n (service.defaultDescription | async) ||\n ('skyux_description_list_none_found' | skyLibResources)\n }}\n </span>\n</ng-template>\n", styles: [".sky-description-list-description:not(:empty)+.sky-description-list-default-value{display:none}\n"] }]
1460
- }], ctorParameters: function () { return [{ type: SkyDescriptionListService }, { type: i0.ChangeDetectorRef }, { type: i1$1.SkyThemeService, decorators: [{
1461
- type: Optional
1462
- }] }]; }, propDecorators: { templateRef: [{
1463
- type: ViewChild,
1464
- args: ['descriptionTemplateRef', {
1465
- read: TemplateRef,
1466
- static: true,
1467
- }]
1468
- }] } });
1469
-
1470
- /**
1471
- * Specifies the term in a term-description pair. To display a help button beside
1472
- * the term, include a help button element in the sky-description-list-term element
1473
- * and a sky-control-help CSS class on that element.
1474
- */
1475
- class SkyDescriptionListTermComponent {
1476
- }
1477
- SkyDescriptionListTermComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListTermComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1478
- SkyDescriptionListTermComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyDescriptionListTermComponent, selector: "sky-description-list-term", viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["termTemplateRef"], descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<ng-template #termTemplateRef\n ><span skyTrim><ng-content></ng-content></span\n ><span class=\"sky-control-help-container\"\n ><ng-content select=\".sky-control-help\"></ng-content></span\n></ng-template>\n", dependencies: [{ kind: "directive", type: i1$2.λ4, selector: "[skyTrim]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1479
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListTermComponent, decorators: [{
1480
- type: Component,
1481
- args: [{ selector: 'sky-description-list-term', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #termTemplateRef\n ><span skyTrim><ng-content></ng-content></span\n ><span class=\"sky-control-help-container\"\n ><ng-content select=\".sky-control-help\"></ng-content></span\n></ng-template>\n" }]
1482
- }], propDecorators: { templateRef: [{
1483
- type: ViewChild,
1484
- args: ['termTemplateRef', {
1485
- read: TemplateRef,
1486
- static: true,
1487
- }]
1488
- }] } });
1489
-
1490
- /**
1491
- * Wraps the term-description pairs in the description list.
1492
- */
1493
- class SkyDescriptionListContentComponent {
1494
- }
1495
- SkyDescriptionListContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1496
- SkyDescriptionListContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyDescriptionListContentComponent, selector: "sky-description-list-content", queries: [{ propertyName: "termComponents", predicate: SkyDescriptionListTermComponent }, { propertyName: "descriptionComponents", predicate: SkyDescriptionListDescriptionComponent }], ngImport: i0, template: "<ng-content></ng-content>\n" });
1497
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListContentComponent, decorators: [{
1498
- type: Component,
1499
- args: [{ selector: 'sky-description-list-content', template: "<ng-content></ng-content>\n" }]
1500
- }], propDecorators: { termComponents: [{
1501
- type: ContentChildren,
1502
- args: [SkyDescriptionListTermComponent]
1503
- }], descriptionComponents: [{
1504
- type: ContentChildren,
1505
- args: [SkyDescriptionListDescriptionComponent]
1506
- }] } });
1507
-
1508
- var _SkyDescriptionListAdapterService_instances, _SkyDescriptionListAdapterService_renderer, _SkyDescriptionListAdapterService_getResponsiveClassName;
1509
- /**
1510
- * @internal
1511
- */
1512
- class SkyDescriptionListAdapterService {
1513
- constructor(rendererFactory) {
1514
- _SkyDescriptionListAdapterService_instances.add(this);
1515
- _SkyDescriptionListAdapterService_renderer.set(this, void 0);
1516
- __classPrivateFieldSet(this, _SkyDescriptionListAdapterService_renderer, rendererFactory.createRenderer(undefined, null), "f");
1517
- }
1518
- getWidth(elementRef) {
1519
- return elementRef.nativeElement.clientWidth;
1520
- }
1521
- setResponsiveClass(element) {
1522
- const nativeEl = element.nativeElement;
1523
- const width = this.getWidth(element);
1524
- const className = __classPrivateFieldGet(this, _SkyDescriptionListAdapterService_instances, "m", _SkyDescriptionListAdapterService_getResponsiveClassName).call(this, width);
1525
- __classPrivateFieldGet(this, _SkyDescriptionListAdapterService_renderer, "f").removeClass(nativeEl, 'sky-responsive-container-xs');
1526
- __classPrivateFieldGet(this, _SkyDescriptionListAdapterService_renderer, "f").removeClass(nativeEl, 'sky-responsive-container-sm');
1527
- __classPrivateFieldGet(this, _SkyDescriptionListAdapterService_renderer, "f").removeClass(nativeEl, 'sky-responsive-container-md');
1528
- __classPrivateFieldGet(this, _SkyDescriptionListAdapterService_renderer, "f").addClass(nativeEl, className);
1529
- }
1530
- }
1531
- _SkyDescriptionListAdapterService_renderer = new WeakMap(), _SkyDescriptionListAdapterService_instances = new WeakSet(), _SkyDescriptionListAdapterService_getResponsiveClassName = function _SkyDescriptionListAdapterService_getResponsiveClassName(width) {
1532
- const xsBreakpointMaxPixels = 479;
1533
- const smBreakpointMinPixels = 480;
1534
- const smBreakpointMaxPixels = 767;
1535
- if (width <= xsBreakpointMaxPixels) {
1536
- return 'sky-responsive-container-xs';
1537
- }
1538
- else if (width >= smBreakpointMinPixels &&
1539
- width <= smBreakpointMaxPixels) {
1540
- return 'sky-responsive-container-sm';
1541
- }
1542
- else {
1543
- return 'sky-responsive-container-md';
1544
- }
1545
- };
1546
- SkyDescriptionListAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListAdapterService, deps: [{ token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
1547
- SkyDescriptionListAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListAdapterService });
1548
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListAdapterService, decorators: [{
1549
- type: Injectable
1550
- }], ctorParameters: function () { return [{ type: i0.RendererFactory2 }]; } });
1551
-
1552
- var _SkyDescriptionListComponent_instances, _SkyDescriptionListComponent_ngUnsubscribe, _SkyDescriptionListComponent__mode, _SkyDescriptionListComponent_adapterService, _SkyDescriptionListComponent_changeDetector, _SkyDescriptionListComponent_descriptionListService, _SkyDescriptionListComponent_updateResponsiveClass;
1553
- /**
1554
- * Creates a description list to display term-description pairs.
1555
- */
1556
- class SkyDescriptionListComponent {
1557
- /**
1558
- * The default description to display when no description is provided
1559
- * for a term-description pair.
1560
- * @default "None found"
1561
- */
1562
- set defaultDescription(value) {
1563
- __classPrivateFieldGet(this, _SkyDescriptionListComponent_descriptionListService, "f").updateDefaultDescription(value);
1564
- }
1565
- /**
1566
- * How to display term-description pairs within the description list.
1567
- * @default "vertical"
1568
- */
1569
- set mode(value) {
1570
- __classPrivateFieldSet(this, _SkyDescriptionListComponent__mode, value || 'vertical', "f");
1571
- }
1572
- get mode() {
1573
- return __classPrivateFieldGet(this, _SkyDescriptionListComponent__mode, "f");
1574
- }
1575
- constructor(adapterService, changeDetector, descriptionListService) {
1576
- _SkyDescriptionListComponent_instances.add(this);
1577
- _SkyDescriptionListComponent_ngUnsubscribe.set(this, new Subject());
1578
- _SkyDescriptionListComponent__mode.set(this, 'vertical');
1579
- _SkyDescriptionListComponent_adapterService.set(this, void 0);
1580
- _SkyDescriptionListComponent_changeDetector.set(this, void 0);
1581
- _SkyDescriptionListComponent_descriptionListService.set(this, void 0);
1582
- __classPrivateFieldSet(this, _SkyDescriptionListComponent_adapterService, adapterService, "f");
1583
- __classPrivateFieldSet(this, _SkyDescriptionListComponent_changeDetector, changeDetector, "f");
1584
- __classPrivateFieldSet(this, _SkyDescriptionListComponent_descriptionListService, descriptionListService, "f");
1585
- }
1586
- ngAfterContentInit() {
1587
- // Wait for all content to render before detecting parent width.
1588
- setTimeout(() => {
1589
- __classPrivateFieldGet(this, _SkyDescriptionListComponent_instances, "m", _SkyDescriptionListComponent_updateResponsiveClass).call(this);
1590
- });
1591
- // istanbul ignore else
1592
- if (this.contentComponents) {
1593
- this.contentComponents.changes
1594
- .pipe(takeUntil(__classPrivateFieldGet(this, _SkyDescriptionListComponent_ngUnsubscribe, "f")))
1595
- .subscribe(() => {
1596
- __classPrivateFieldGet(this, _SkyDescriptionListComponent_changeDetector, "f").markForCheck();
1597
- });
1598
- }
1599
- }
1600
- ngOnDestroy() {
1601
- __classPrivateFieldGet(this, _SkyDescriptionListComponent_ngUnsubscribe, "f").next();
1602
- __classPrivateFieldGet(this, _SkyDescriptionListComponent_ngUnsubscribe, "f").complete();
1603
- }
1604
- onWindowResize() {
1605
- __classPrivateFieldGet(this, _SkyDescriptionListComponent_instances, "m", _SkyDescriptionListComponent_updateResponsiveClass).call(this);
1606
- }
1607
- }
1608
- _SkyDescriptionListComponent_ngUnsubscribe = new WeakMap(), _SkyDescriptionListComponent__mode = new WeakMap(), _SkyDescriptionListComponent_adapterService = new WeakMap(), _SkyDescriptionListComponent_changeDetector = new WeakMap(), _SkyDescriptionListComponent_descriptionListService = new WeakMap(), _SkyDescriptionListComponent_instances = new WeakSet(), _SkyDescriptionListComponent_updateResponsiveClass = function _SkyDescriptionListComponent_updateResponsiveClass() {
1609
- if (this.elementRef) {
1610
- __classPrivateFieldGet(this, _SkyDescriptionListComponent_adapterService, "f").setResponsiveClass(this.elementRef);
1611
- __classPrivateFieldGet(this, _SkyDescriptionListComponent_changeDetector, "f").markForCheck();
1612
- }
1613
- };
1614
- SkyDescriptionListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListComponent, deps: [{ token: SkyDescriptionListAdapterService }, { token: i0.ChangeDetectorRef }, { token: SkyDescriptionListService }], target: i0.ɵɵFactoryTarget.Component });
1615
- SkyDescriptionListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyDescriptionListComponent, selector: "sky-description-list", inputs: { defaultDescription: "defaultDescription", listItemWidth: "listItemWidth", mode: "mode" }, host: { listeners: { "window:resize": "onWindowResize()" } }, providers: [SkyDescriptionListAdapterService, SkyDescriptionListService], queries: [{ propertyName: "contentComponents", predicate: SkyDescriptionListContentComponent }], viewQueries: [{ propertyName: "elementRef", first: true, predicate: ["descriptionListElement"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<dl\n class=\"sky-description-list\"\n [ngClass]=\"{\n 'sky-description-list-long-description-mode': mode === 'longDescription',\n 'sky-description-list-vertical-mode': mode === 'vertical',\n 'sky-description-list-horizontal-mode': mode === 'horizontal'\n }\"\n #descriptionListElement\n>\n <!--\n Wrapping div is for horizontal flexing. Also injecting children's templateRef directly\n to avoid adding non-semantic HTML tags to DOM\n -->\n <div\n *ngFor=\"let contentComponent of contentComponents\"\n class=\"sky-description-list-content\"\n [style.width]=\"mode === 'horizontal' ? listItemWidth : ''\"\n >\n <dt *ngFor=\"let termComponent of contentComponent?.termComponents\">\n <ng-container *ngIf=\"termComponent.templateRef\">\n <ng-container\n *ngTemplateOutlet=\"termComponent.templateRef\"\n ></ng-container>\n </ng-container>\n </dt>\n <dd\n *ngFor=\"\n let descriptionComponent of contentComponent?.descriptionComponents\n \"\n >\n <ng-container *ngIf=\"descriptionComponent.templateRef\">\n <ng-container\n *ngTemplateOutlet=\"descriptionComponent.templateRef\"\n ></ng-container>\n </ng-container>\n </dd>\n </div>\n</dl>\n", styles: [":host{display:block}.sky-description-list{margin:0;padding:0}.sky-description-list dt{color:#686c73;font-size:14px;font-weight:400;margin:0 0 3px;padding:0}.sky-description-list dd{margin:0;padding:0}.sky-description-list.sky-description-list-vertical-mode .sky-description-list-content{width:auto}.sky-description-list.sky-description-list-vertical-mode .sky-description-list-content:not(:last-child){margin:0 0 15px}.sky-description-list.sky-description-list-horizontal-mode{display:flex;flex-wrap:wrap;margin:0 0 var(--sky-compat-description-list-margin-bottom, -15px) 0}.sky-description-list.sky-description-list-horizontal-mode .sky-description-list-content{margin:0 0 15px;padding:0 60px 0 0;min-width:100px;width:auto}.sky-description-list.sky-description-list-horizontal-mode.sky-responsive-container-xs .sky-description-list-content,.sky-description-list.sky-description-list-horizontal-mode.sky-responsive-container-sm .sky-description-list-content{width:50%}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content{display:flex}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content:not(:last-child){margin:0 0 10px}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content dt{color:#212327;font-size:16px;font-weight:600;margin:0 20px 0 0;width:25%;word-break:break-word}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content dd{flex:1}.sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs .sky-description-list-content{flex-direction:column}.sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs .sky-description-list-content dt{margin:0 0 3px;width:100%}.sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs .sky-description-list-content dd{margin:0 0 10px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-vertical-mode .sky-description-list-content:not(:last-child){margin:0 0 20px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-vertical-mode dt{color:#686c73;font-size:14px;font-weight:400}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-vertical-mode dd{font-size:16px;font-weight:400}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-horizontal-mode{margin:0 0 -20px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-horizontal-mode .sky-description-list-content{margin:0 0 20px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-long-description-mode dt{color:inherit;font-weight:700;font-size:inherit}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-long-description-mode dd{font-size:16px;font-weight:400}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs dt{margin:0 0 5px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs dd{margin:0 0 20px}.sky-theme-modern .sky-description-list.sky-description-list-vertical-mode .sky-description-list-content:not(:last-child){margin:0 0 20px}.sky-theme-modern .sky-description-list.sky-description-list-vertical-mode dt{color:#686c73;font-size:14px;font-weight:400}.sky-theme-modern .sky-description-list.sky-description-list-vertical-mode dd{font-size:16px;font-weight:400}.sky-theme-modern .sky-description-list.sky-description-list-horizontal-mode{margin:0 0 -20px}.sky-theme-modern .sky-description-list.sky-description-list-horizontal-mode .sky-description-list-content{margin:0 0 20px}.sky-theme-modern .sky-description-list.sky-description-list-long-description-mode dt{color:inherit;font-weight:700;font-size:inherit}.sky-theme-modern .sky-description-list.sky-description-list-long-description-mode dd{font-size:16px;font-weight:400}.sky-theme-modern .sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs dt{margin:0 0 5px}.sky-theme-modern .sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs dd{margin:0 0 20px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1616
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListComponent, decorators: [{
1617
- type: Component,
1618
- args: [{ selector: 'sky-description-list', providers: [SkyDescriptionListAdapterService, SkyDescriptionListService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<dl\n class=\"sky-description-list\"\n [ngClass]=\"{\n 'sky-description-list-long-description-mode': mode === 'longDescription',\n 'sky-description-list-vertical-mode': mode === 'vertical',\n 'sky-description-list-horizontal-mode': mode === 'horizontal'\n }\"\n #descriptionListElement\n>\n <!--\n Wrapping div is for horizontal flexing. Also injecting children's templateRef directly\n to avoid adding non-semantic HTML tags to DOM\n -->\n <div\n *ngFor=\"let contentComponent of contentComponents\"\n class=\"sky-description-list-content\"\n [style.width]=\"mode === 'horizontal' ? listItemWidth : ''\"\n >\n <dt *ngFor=\"let termComponent of contentComponent?.termComponents\">\n <ng-container *ngIf=\"termComponent.templateRef\">\n <ng-container\n *ngTemplateOutlet=\"termComponent.templateRef\"\n ></ng-container>\n </ng-container>\n </dt>\n <dd\n *ngFor=\"\n let descriptionComponent of contentComponent?.descriptionComponents\n \"\n >\n <ng-container *ngIf=\"descriptionComponent.templateRef\">\n <ng-container\n *ngTemplateOutlet=\"descriptionComponent.templateRef\"\n ></ng-container>\n </ng-container>\n </dd>\n </div>\n</dl>\n", styles: [":host{display:block}.sky-description-list{margin:0;padding:0}.sky-description-list dt{color:#686c73;font-size:14px;font-weight:400;margin:0 0 3px;padding:0}.sky-description-list dd{margin:0;padding:0}.sky-description-list.sky-description-list-vertical-mode .sky-description-list-content{width:auto}.sky-description-list.sky-description-list-vertical-mode .sky-description-list-content:not(:last-child){margin:0 0 15px}.sky-description-list.sky-description-list-horizontal-mode{display:flex;flex-wrap:wrap;margin:0 0 var(--sky-compat-description-list-margin-bottom, -15px) 0}.sky-description-list.sky-description-list-horizontal-mode .sky-description-list-content{margin:0 0 15px;padding:0 60px 0 0;min-width:100px;width:auto}.sky-description-list.sky-description-list-horizontal-mode.sky-responsive-container-xs .sky-description-list-content,.sky-description-list.sky-description-list-horizontal-mode.sky-responsive-container-sm .sky-description-list-content{width:50%}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content{display:flex}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content:not(:last-child){margin:0 0 10px}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content dt{color:#212327;font-size:16px;font-weight:600;margin:0 20px 0 0;width:25%;word-break:break-word}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content dd{flex:1}.sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs .sky-description-list-content{flex-direction:column}.sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs .sky-description-list-content dt{margin:0 0 3px;width:100%}.sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs .sky-description-list-content dd{margin:0 0 10px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-vertical-mode .sky-description-list-content:not(:last-child){margin:0 0 20px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-vertical-mode dt{color:#686c73;font-size:14px;font-weight:400}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-vertical-mode dd{font-size:16px;font-weight:400}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-horizontal-mode{margin:0 0 -20px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-horizontal-mode .sky-description-list-content{margin:0 0 20px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-long-description-mode dt{color:inherit;font-weight:700;font-size:inherit}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-long-description-mode dd{font-size:16px;font-weight:400}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs dt{margin:0 0 5px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs dd{margin:0 0 20px}.sky-theme-modern .sky-description-list.sky-description-list-vertical-mode .sky-description-list-content:not(:last-child){margin:0 0 20px}.sky-theme-modern .sky-description-list.sky-description-list-vertical-mode dt{color:#686c73;font-size:14px;font-weight:400}.sky-theme-modern .sky-description-list.sky-description-list-vertical-mode dd{font-size:16px;font-weight:400}.sky-theme-modern .sky-description-list.sky-description-list-horizontal-mode{margin:0 0 -20px}.sky-theme-modern .sky-description-list.sky-description-list-horizontal-mode .sky-description-list-content{margin:0 0 20px}.sky-theme-modern .sky-description-list.sky-description-list-long-description-mode dt{color:inherit;font-weight:700;font-size:inherit}.sky-theme-modern .sky-description-list.sky-description-list-long-description-mode dd{font-size:16px;font-weight:400}.sky-theme-modern .sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs dt{margin:0 0 5px}.sky-theme-modern .sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs dd{margin:0 0 20px}\n"] }]
1619
- }], ctorParameters: function () { return [{ type: SkyDescriptionListAdapterService }, { type: i0.ChangeDetectorRef }, { type: SkyDescriptionListService }]; }, propDecorators: { defaultDescription: [{
1620
- type: Input
1621
- }], listItemWidth: [{
1622
- type: Input
1623
- }], mode: [{
1624
- type: Input
1625
- }], contentComponents: [{
1626
- type: ContentChildren,
1627
- args: [SkyDescriptionListContentComponent]
1628
- }], elementRef: [{
1629
- type: ViewChild,
1630
- args: ['descriptionListElement', {
1631
- read: ElementRef,
1632
- static: true,
1633
- }]
1634
- }], onWindowResize: [{
1635
- type: HostListener,
1636
- args: ['window:resize']
1637
- }] } });
1638
-
1639
- class SkyDescriptionListModule {
1640
- }
1641
- SkyDescriptionListModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1642
- SkyDescriptionListModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListModule, declarations: [SkyDescriptionListComponent,
1643
- SkyDescriptionListContentComponent,
1644
- SkyDescriptionListTermComponent,
1645
- SkyDescriptionListDescriptionComponent], imports: [CommonModule,
1646
- SkyI18nModule,
1647
- SkyLayoutResourcesModule,
1648
- SkyThemeModule,
1649
- SkyTrimModule], exports: [SkyDescriptionListComponent,
1650
- SkyDescriptionListContentComponent,
1651
- SkyDescriptionListTermComponent,
1652
- SkyDescriptionListDescriptionComponent] });
1653
- SkyDescriptionListModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListModule, imports: [CommonModule,
1654
- SkyI18nModule,
1655
- SkyLayoutResourcesModule,
1656
- SkyThemeModule,
1657
- SkyTrimModule] });
1658
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyDescriptionListModule, decorators: [{
1659
- type: NgModule,
1660
- args: [{
1661
- declarations: [
1662
- SkyDescriptionListComponent,
1663
- SkyDescriptionListContentComponent,
1664
- SkyDescriptionListTermComponent,
1665
- SkyDescriptionListDescriptionComponent,
1666
- ],
1667
- imports: [
1668
- CommonModule,
1669
- SkyI18nModule,
1670
- SkyLayoutResourcesModule,
1671
- SkyThemeModule,
1672
- SkyTrimModule,
1673
- ],
1674
- exports: [
1675
- SkyDescriptionListComponent,
1676
- SkyDescriptionListContentComponent,
1677
- SkyDescriptionListTermComponent,
1678
- SkyDescriptionListDescriptionComponent,
1679
- ],
1680
- }]
1681
- }] });
1682
-
1683
- /**
1684
- * @deprecated Use `SkyDescriptionListModeType` instead.
1685
- * @internal
1686
- * How to display the term-description pairs within a description list.
1687
- */
1688
- var SkyDescriptionListMode;
1689
- (function (SkyDescriptionListMode) {
1690
- /**
1691
- * Displays term-description pairs side by side in a horizontal list.
1692
- * This mode provides a responsive layout.
1693
- */
1694
- SkyDescriptionListMode["horizontal"] = "horizontal";
1695
- /**
1696
- * Displays terms and descriptions side by side with the term on the left and the description
1697
- * on the right. This mode includes room for long descriptions and uses a responsive layout
1698
- * that stacks term-description pairs vertically.
1699
- */
1700
- SkyDescriptionListMode["longDescription"] = "longDescription";
1701
- /**
1702
- * Displays term-description pairs in a vertical list.
1703
- */
1704
- SkyDescriptionListMode["vertical"] = "vertical";
1705
- })(SkyDescriptionListMode || (SkyDescriptionListMode = {}));
1706
-
1707
- var _SkyColumnComponent__screenXSmall;
1708
- /**
1709
- * Displays a column within a row of the fluid grid.
1710
- */
1711
- class SkyColumnComponent {
1712
- constructor() {
1713
- _SkyColumnComponent__screenXSmall.set(this, 12);
1714
- }
1715
- /**
1716
- * The number of columns (1-12) on extra-small screens
1717
- * (less than 768px). If you do not specify a value, the fluid grid displays
1718
- * the column at the full width of the screen.
1719
- * @default 12
1720
- */
1721
- set screenXSmall(value) {
1722
- __classPrivateFieldSet(this, _SkyColumnComponent__screenXSmall, value ?? 12, "f");
1723
- }
1724
- get screenXSmall() {
1725
- return __classPrivateFieldGet(this, _SkyColumnComponent__screenXSmall, "f");
1726
- }
1727
- ngOnChanges(changes) {
1728
- /* istanbul ignore else */
1729
- if (changes['screenXSmall'] ||
1730
- changes['screenSmall'] ||
1731
- changes['screenMedium'] ||
1732
- changes['screenLarge']) {
1733
- this.classnames = this.getClassNames();
1734
- }
1735
- }
1736
- getClassNames() {
1737
- const classnames = ['sky-column'];
1738
- if (this.screenXSmall) {
1739
- classnames.push(`sky-column-xs-${this.screenXSmall}`);
1740
- }
1741
- if (this.screenSmall) {
1742
- classnames.push(`sky-column-sm-${this.screenSmall}`);
1743
- }
1744
- if (this.screenMedium) {
1745
- classnames.push(`sky-column-md-${this.screenMedium}`);
1746
- }
1747
- if (this.screenLarge) {
1748
- classnames.push(`sky-column-lg-${this.screenLarge}`);
1749
- }
1750
- return classnames.join(' ');
1751
- }
1752
- ngOnInit() {
1753
- this.classnames = this.getClassNames();
1754
- }
1755
- }
1756
- _SkyColumnComponent__screenXSmall = new WeakMap();
1757
- SkyColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1758
- SkyColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyColumnComponent, selector: "sky-column", inputs: { screenXSmall: "screenXSmall", screenSmall: "screenSmall", screenMedium: "screenMedium", screenLarge: "screenLarge" }, host: { properties: { "class": "this.classnames" } }, usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: ["sky-column.sky-column{padding-right:15px;padding-left:15px;width:100%;min-height:1px}.sky-theme-modern sky-column.sky-column{padding-right:30px;padding-left:30px}.sky-fluid-grid-gutter-size-small sky-column.sky-column{padding-right:5px;padding-left:5px}.sky-fluid-grid-gutter-size-medium sky-column.sky-column{padding-right:10px;padding-left:10px}.sky-theme-modern .sky-fluid-grid-gutter-size-small sky-column.sky-column{padding-right:10px;padding-left:10px}.sky-theme-modern .sky-fluid-grid-gutter-size-medium sky-column.sky-column{padding-right:15px;padding-left:15px}sky-column.sky-column-xs-1{width:calc(1 / 12 * 100%)}sky-column.sky-column-xs-2{width:calc(2 / 12 * 100%)}sky-column.sky-column-xs-3{width:25%}sky-column.sky-column-xs-4{width:calc(4 / 12 * 100%)}sky-column.sky-column-xs-5{width:calc(5 / 12 * 100%)}sky-column.sky-column-xs-6{width:50%}sky-column.sky-column-xs-7{width:calc(7 / 12 * 100%)}sky-column.sky-column-xs-8{width:calc(8 / 12 * 100%)}sky-column.sky-column-xs-9{width:75%}sky-column.sky-column-xs-10{width:calc(10 / 12 * 100%)}sky-column.sky-column-xs-11{width:calc(11 / 12 * 100%)}sky-column.sky-column-xs-12{width:100%}sky-column:not([class*=sky-column-xs-]){width:100%}.sky-responsive-container-xs sky-column.sky-column-xs-1,.sky-responsive-container-sm sky-column.sky-column-xs-1,.sky-responsive-container-md sky-column.sky-column-xs-1,.sky-responsive-container-lg sky-column.sky-column-xs-1{width:calc(1 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-2,.sky-responsive-container-sm sky-column.sky-column-xs-2,.sky-responsive-container-md sky-column.sky-column-xs-2,.sky-responsive-container-lg sky-column.sky-column-xs-2{width:calc(2 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-3,.sky-responsive-container-sm sky-column.sky-column-xs-3,.sky-responsive-container-md sky-column.sky-column-xs-3,.sky-responsive-container-lg sky-column.sky-column-xs-3{width:25%}.sky-responsive-container-xs sky-column.sky-column-xs-4,.sky-responsive-container-sm sky-column.sky-column-xs-4,.sky-responsive-container-md sky-column.sky-column-xs-4,.sky-responsive-container-lg sky-column.sky-column-xs-4{width:calc(4 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-5,.sky-responsive-container-sm sky-column.sky-column-xs-5,.sky-responsive-container-md sky-column.sky-column-xs-5,.sky-responsive-container-lg sky-column.sky-column-xs-5{width:calc(5 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-6,.sky-responsive-container-sm sky-column.sky-column-xs-6,.sky-responsive-container-md sky-column.sky-column-xs-6,.sky-responsive-container-lg sky-column.sky-column-xs-6{width:50%}.sky-responsive-container-xs sky-column.sky-column-xs-7,.sky-responsive-container-sm sky-column.sky-column-xs-7,.sky-responsive-container-md sky-column.sky-column-xs-7,.sky-responsive-container-lg sky-column.sky-column-xs-7{width:calc(7 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-8,.sky-responsive-container-sm sky-column.sky-column-xs-8,.sky-responsive-container-md sky-column.sky-column-xs-8,.sky-responsive-container-lg sky-column.sky-column-xs-8{width:calc(8 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-9,.sky-responsive-container-sm sky-column.sky-column-xs-9,.sky-responsive-container-md sky-column.sky-column-xs-9,.sky-responsive-container-lg sky-column.sky-column-xs-9{width:75%}.sky-responsive-container-xs sky-column.sky-column-xs-10,.sky-responsive-container-sm sky-column.sky-column-xs-10,.sky-responsive-container-md sky-column.sky-column-xs-10,.sky-responsive-container-lg sky-column.sky-column-xs-10{width:calc(10 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-11,.sky-responsive-container-sm sky-column.sky-column-xs-11,.sky-responsive-container-md sky-column.sky-column-xs-11,.sky-responsive-container-lg sky-column.sky-column-xs-11{width:calc(11 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-12,.sky-responsive-container-sm sky-column.sky-column-xs-12,.sky-responsive-container-md sky-column.sky-column-xs-12,.sky-responsive-container-lg sky-column.sky-column-xs-12{width:100%}.sky-responsive-container-xs sky-column:not([class*=sky-column-xs-]),.sky-responsive-container-sm sky-column:not([class*=sky-column-xs-]),.sky-responsive-container-md sky-column:not([class*=sky-column-xs-]),.sky-responsive-container-lg sky-column:not([class*=sky-column-xs-]){width:100%}@media (min-width: 768px){sky-column.sky-column-sm-1{width:calc(1 / 12 * 100%)}sky-column.sky-column-sm-2{width:calc(2 / 12 * 100%)}sky-column.sky-column-sm-3{width:25%}sky-column.sky-column-sm-4{width:calc(4 / 12 * 100%)}sky-column.sky-column-sm-5{width:calc(5 / 12 * 100%)}sky-column.sky-column-sm-6{width:50%}sky-column.sky-column-sm-7{width:calc(7 / 12 * 100%)}sky-column.sky-column-sm-8{width:calc(8 / 12 * 100%)}sky-column.sky-column-sm-9{width:75%}sky-column.sky-column-sm-10{width:calc(10 / 12 * 100%)}sky-column.sky-column-sm-11{width:calc(11 / 12 * 100%)}sky-column.sky-column-sm-12{width:100%}}.sky-responsive-container-sm sky-column.sky-column-sm-1,.sky-responsive-container-md sky-column.sky-column-sm-1,.sky-responsive-container-lg sky-column.sky-column-sm-1{width:calc(1 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-2,.sky-responsive-container-md sky-column.sky-column-sm-2,.sky-responsive-container-lg sky-column.sky-column-sm-2{width:calc(2 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-3,.sky-responsive-container-md sky-column.sky-column-sm-3,.sky-responsive-container-lg sky-column.sky-column-sm-3{width:25%}.sky-responsive-container-sm sky-column.sky-column-sm-4,.sky-responsive-container-md sky-column.sky-column-sm-4,.sky-responsive-container-lg sky-column.sky-column-sm-4{width:calc(4 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-5,.sky-responsive-container-md sky-column.sky-column-sm-5,.sky-responsive-container-lg sky-column.sky-column-sm-5{width:calc(5 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-6,.sky-responsive-container-md sky-column.sky-column-sm-6,.sky-responsive-container-lg sky-column.sky-column-sm-6{width:50%}.sky-responsive-container-sm sky-column.sky-column-sm-7,.sky-responsive-container-md sky-column.sky-column-sm-7,.sky-responsive-container-lg sky-column.sky-column-sm-7{width:calc(7 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-8,.sky-responsive-container-md sky-column.sky-column-sm-8,.sky-responsive-container-lg sky-column.sky-column-sm-8{width:calc(8 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-9,.sky-responsive-container-md sky-column.sky-column-sm-9,.sky-responsive-container-lg sky-column.sky-column-sm-9{width:75%}.sky-responsive-container-sm sky-column.sky-column-sm-10,.sky-responsive-container-md sky-column.sky-column-sm-10,.sky-responsive-container-lg sky-column.sky-column-sm-10{width:calc(10 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-11,.sky-responsive-container-md sky-column.sky-column-sm-11,.sky-responsive-container-lg sky-column.sky-column-sm-11{width:calc(11 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-12,.sky-responsive-container-md sky-column.sky-column-sm-12,.sky-responsive-container-lg sky-column.sky-column-sm-12{width:100%}@media (min-width: 992px){sky-column.sky-column-md-1{width:calc(1 / 12 * 100%)}sky-column.sky-column-md-2{width:calc(2 / 12 * 100%)}sky-column.sky-column-md-3{width:25%}sky-column.sky-column-md-4{width:calc(4 / 12 * 100%)}sky-column.sky-column-md-5{width:calc(5 / 12 * 100%)}sky-column.sky-column-md-6{width:50%}sky-column.sky-column-md-7{width:calc(7 / 12 * 100%)}sky-column.sky-column-md-8{width:calc(8 / 12 * 100%)}sky-column.sky-column-md-9{width:75%}sky-column.sky-column-md-10{width:calc(10 / 12 * 100%)}sky-column.sky-column-md-11{width:calc(11 / 12 * 100%)}sky-column.sky-column-md-12{width:100%}}.sky-responsive-container-md sky-column.sky-column-md-1,.sky-responsive-container-lg sky-column.sky-column-md-1{width:calc(1 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-2,.sky-responsive-container-lg sky-column.sky-column-md-2{width:calc(2 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-3,.sky-responsive-container-lg sky-column.sky-column-md-3{width:25%}.sky-responsive-container-md sky-column.sky-column-md-4,.sky-responsive-container-lg sky-column.sky-column-md-4{width:calc(4 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-5,.sky-responsive-container-lg sky-column.sky-column-md-5{width:calc(5 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-6,.sky-responsive-container-lg sky-column.sky-column-md-6{width:50%}.sky-responsive-container-md sky-column.sky-column-md-7,.sky-responsive-container-lg sky-column.sky-column-md-7{width:calc(7 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-8,.sky-responsive-container-lg sky-column.sky-column-md-8{width:calc(8 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-9,.sky-responsive-container-lg sky-column.sky-column-md-9{width:75%}.sky-responsive-container-md sky-column.sky-column-md-10,.sky-responsive-container-lg sky-column.sky-column-md-10{width:calc(10 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-11,.sky-responsive-container-lg sky-column.sky-column-md-11{width:calc(11 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-12,.sky-responsive-container-lg sky-column.sky-column-md-12{width:100%}@media (min-width: 1200px){sky-column.sky-column-lg-1{width:calc(1 / 12 * 100%)}sky-column.sky-column-lg-2{width:calc(2 / 12 * 100%)}sky-column.sky-column-lg-3{width:25%}sky-column.sky-column-lg-4{width:calc(4 / 12 * 100%)}sky-column.sky-column-lg-5{width:calc(5 / 12 * 100%)}sky-column.sky-column-lg-6{width:50%}sky-column.sky-column-lg-7{width:calc(7 / 12 * 100%)}sky-column.sky-column-lg-8{width:calc(8 / 12 * 100%)}sky-column.sky-column-lg-9{width:75%}sky-column.sky-column-lg-10{width:calc(10 / 12 * 100%)}sky-column.sky-column-lg-11{width:calc(11 / 12 * 100%)}sky-column.sky-column-lg-12{width:100%}}.sky-responsive-container-lg sky-column.sky-column-lg-1{width:calc(1 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-2{width:calc(2 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-3{width:25%}.sky-responsive-container-lg sky-column.sky-column-lg-4{width:calc(4 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-5{width:calc(5 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-6{width:50%}.sky-responsive-container-lg sky-column.sky-column-lg-7{width:calc(7 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-8{width:calc(8 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-9{width:75%}.sky-responsive-container-lg sky-column.sky-column-lg-10{width:calc(10 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-11{width:calc(11 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-12{width:100%}\n"], encapsulation: i0.ViewEncapsulation.None });
1759
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyColumnComponent, decorators: [{
1760
- type: Component,
1761
- args: [{ selector: 'sky-column', encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n", styles: ["sky-column.sky-column{padding-right:15px;padding-left:15px;width:100%;min-height:1px}.sky-theme-modern sky-column.sky-column{padding-right:30px;padding-left:30px}.sky-fluid-grid-gutter-size-small sky-column.sky-column{padding-right:5px;padding-left:5px}.sky-fluid-grid-gutter-size-medium sky-column.sky-column{padding-right:10px;padding-left:10px}.sky-theme-modern .sky-fluid-grid-gutter-size-small sky-column.sky-column{padding-right:10px;padding-left:10px}.sky-theme-modern .sky-fluid-grid-gutter-size-medium sky-column.sky-column{padding-right:15px;padding-left:15px}sky-column.sky-column-xs-1{width:calc(1 / 12 * 100%)}sky-column.sky-column-xs-2{width:calc(2 / 12 * 100%)}sky-column.sky-column-xs-3{width:25%}sky-column.sky-column-xs-4{width:calc(4 / 12 * 100%)}sky-column.sky-column-xs-5{width:calc(5 / 12 * 100%)}sky-column.sky-column-xs-6{width:50%}sky-column.sky-column-xs-7{width:calc(7 / 12 * 100%)}sky-column.sky-column-xs-8{width:calc(8 / 12 * 100%)}sky-column.sky-column-xs-9{width:75%}sky-column.sky-column-xs-10{width:calc(10 / 12 * 100%)}sky-column.sky-column-xs-11{width:calc(11 / 12 * 100%)}sky-column.sky-column-xs-12{width:100%}sky-column:not([class*=sky-column-xs-]){width:100%}.sky-responsive-container-xs sky-column.sky-column-xs-1,.sky-responsive-container-sm sky-column.sky-column-xs-1,.sky-responsive-container-md sky-column.sky-column-xs-1,.sky-responsive-container-lg sky-column.sky-column-xs-1{width:calc(1 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-2,.sky-responsive-container-sm sky-column.sky-column-xs-2,.sky-responsive-container-md sky-column.sky-column-xs-2,.sky-responsive-container-lg sky-column.sky-column-xs-2{width:calc(2 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-3,.sky-responsive-container-sm sky-column.sky-column-xs-3,.sky-responsive-container-md sky-column.sky-column-xs-3,.sky-responsive-container-lg sky-column.sky-column-xs-3{width:25%}.sky-responsive-container-xs sky-column.sky-column-xs-4,.sky-responsive-container-sm sky-column.sky-column-xs-4,.sky-responsive-container-md sky-column.sky-column-xs-4,.sky-responsive-container-lg sky-column.sky-column-xs-4{width:calc(4 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-5,.sky-responsive-container-sm sky-column.sky-column-xs-5,.sky-responsive-container-md sky-column.sky-column-xs-5,.sky-responsive-container-lg sky-column.sky-column-xs-5{width:calc(5 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-6,.sky-responsive-container-sm sky-column.sky-column-xs-6,.sky-responsive-container-md sky-column.sky-column-xs-6,.sky-responsive-container-lg sky-column.sky-column-xs-6{width:50%}.sky-responsive-container-xs sky-column.sky-column-xs-7,.sky-responsive-container-sm sky-column.sky-column-xs-7,.sky-responsive-container-md sky-column.sky-column-xs-7,.sky-responsive-container-lg sky-column.sky-column-xs-7{width:calc(7 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-8,.sky-responsive-container-sm sky-column.sky-column-xs-8,.sky-responsive-container-md sky-column.sky-column-xs-8,.sky-responsive-container-lg sky-column.sky-column-xs-8{width:calc(8 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-9,.sky-responsive-container-sm sky-column.sky-column-xs-9,.sky-responsive-container-md sky-column.sky-column-xs-9,.sky-responsive-container-lg sky-column.sky-column-xs-9{width:75%}.sky-responsive-container-xs sky-column.sky-column-xs-10,.sky-responsive-container-sm sky-column.sky-column-xs-10,.sky-responsive-container-md sky-column.sky-column-xs-10,.sky-responsive-container-lg sky-column.sky-column-xs-10{width:calc(10 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-11,.sky-responsive-container-sm sky-column.sky-column-xs-11,.sky-responsive-container-md sky-column.sky-column-xs-11,.sky-responsive-container-lg sky-column.sky-column-xs-11{width:calc(11 / 12 * 100%)}.sky-responsive-container-xs sky-column.sky-column-xs-12,.sky-responsive-container-sm sky-column.sky-column-xs-12,.sky-responsive-container-md sky-column.sky-column-xs-12,.sky-responsive-container-lg sky-column.sky-column-xs-12{width:100%}.sky-responsive-container-xs sky-column:not([class*=sky-column-xs-]),.sky-responsive-container-sm sky-column:not([class*=sky-column-xs-]),.sky-responsive-container-md sky-column:not([class*=sky-column-xs-]),.sky-responsive-container-lg sky-column:not([class*=sky-column-xs-]){width:100%}@media (min-width: 768px){sky-column.sky-column-sm-1{width:calc(1 / 12 * 100%)}sky-column.sky-column-sm-2{width:calc(2 / 12 * 100%)}sky-column.sky-column-sm-3{width:25%}sky-column.sky-column-sm-4{width:calc(4 / 12 * 100%)}sky-column.sky-column-sm-5{width:calc(5 / 12 * 100%)}sky-column.sky-column-sm-6{width:50%}sky-column.sky-column-sm-7{width:calc(7 / 12 * 100%)}sky-column.sky-column-sm-8{width:calc(8 / 12 * 100%)}sky-column.sky-column-sm-9{width:75%}sky-column.sky-column-sm-10{width:calc(10 / 12 * 100%)}sky-column.sky-column-sm-11{width:calc(11 / 12 * 100%)}sky-column.sky-column-sm-12{width:100%}}.sky-responsive-container-sm sky-column.sky-column-sm-1,.sky-responsive-container-md sky-column.sky-column-sm-1,.sky-responsive-container-lg sky-column.sky-column-sm-1{width:calc(1 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-2,.sky-responsive-container-md sky-column.sky-column-sm-2,.sky-responsive-container-lg sky-column.sky-column-sm-2{width:calc(2 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-3,.sky-responsive-container-md sky-column.sky-column-sm-3,.sky-responsive-container-lg sky-column.sky-column-sm-3{width:25%}.sky-responsive-container-sm sky-column.sky-column-sm-4,.sky-responsive-container-md sky-column.sky-column-sm-4,.sky-responsive-container-lg sky-column.sky-column-sm-4{width:calc(4 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-5,.sky-responsive-container-md sky-column.sky-column-sm-5,.sky-responsive-container-lg sky-column.sky-column-sm-5{width:calc(5 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-6,.sky-responsive-container-md sky-column.sky-column-sm-6,.sky-responsive-container-lg sky-column.sky-column-sm-6{width:50%}.sky-responsive-container-sm sky-column.sky-column-sm-7,.sky-responsive-container-md sky-column.sky-column-sm-7,.sky-responsive-container-lg sky-column.sky-column-sm-7{width:calc(7 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-8,.sky-responsive-container-md sky-column.sky-column-sm-8,.sky-responsive-container-lg sky-column.sky-column-sm-8{width:calc(8 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-9,.sky-responsive-container-md sky-column.sky-column-sm-9,.sky-responsive-container-lg sky-column.sky-column-sm-9{width:75%}.sky-responsive-container-sm sky-column.sky-column-sm-10,.sky-responsive-container-md sky-column.sky-column-sm-10,.sky-responsive-container-lg sky-column.sky-column-sm-10{width:calc(10 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-11,.sky-responsive-container-md sky-column.sky-column-sm-11,.sky-responsive-container-lg sky-column.sky-column-sm-11{width:calc(11 / 12 * 100%)}.sky-responsive-container-sm sky-column.sky-column-sm-12,.sky-responsive-container-md sky-column.sky-column-sm-12,.sky-responsive-container-lg sky-column.sky-column-sm-12{width:100%}@media (min-width: 992px){sky-column.sky-column-md-1{width:calc(1 / 12 * 100%)}sky-column.sky-column-md-2{width:calc(2 / 12 * 100%)}sky-column.sky-column-md-3{width:25%}sky-column.sky-column-md-4{width:calc(4 / 12 * 100%)}sky-column.sky-column-md-5{width:calc(5 / 12 * 100%)}sky-column.sky-column-md-6{width:50%}sky-column.sky-column-md-7{width:calc(7 / 12 * 100%)}sky-column.sky-column-md-8{width:calc(8 / 12 * 100%)}sky-column.sky-column-md-9{width:75%}sky-column.sky-column-md-10{width:calc(10 / 12 * 100%)}sky-column.sky-column-md-11{width:calc(11 / 12 * 100%)}sky-column.sky-column-md-12{width:100%}}.sky-responsive-container-md sky-column.sky-column-md-1,.sky-responsive-container-lg sky-column.sky-column-md-1{width:calc(1 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-2,.sky-responsive-container-lg sky-column.sky-column-md-2{width:calc(2 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-3,.sky-responsive-container-lg sky-column.sky-column-md-3{width:25%}.sky-responsive-container-md sky-column.sky-column-md-4,.sky-responsive-container-lg sky-column.sky-column-md-4{width:calc(4 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-5,.sky-responsive-container-lg sky-column.sky-column-md-5{width:calc(5 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-6,.sky-responsive-container-lg sky-column.sky-column-md-6{width:50%}.sky-responsive-container-md sky-column.sky-column-md-7,.sky-responsive-container-lg sky-column.sky-column-md-7{width:calc(7 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-8,.sky-responsive-container-lg sky-column.sky-column-md-8{width:calc(8 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-9,.sky-responsive-container-lg sky-column.sky-column-md-9{width:75%}.sky-responsive-container-md sky-column.sky-column-md-10,.sky-responsive-container-lg sky-column.sky-column-md-10{width:calc(10 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-11,.sky-responsive-container-lg sky-column.sky-column-md-11{width:calc(11 / 12 * 100%)}.sky-responsive-container-md sky-column.sky-column-md-12,.sky-responsive-container-lg sky-column.sky-column-md-12{width:100%}@media (min-width: 1200px){sky-column.sky-column-lg-1{width:calc(1 / 12 * 100%)}sky-column.sky-column-lg-2{width:calc(2 / 12 * 100%)}sky-column.sky-column-lg-3{width:25%}sky-column.sky-column-lg-4{width:calc(4 / 12 * 100%)}sky-column.sky-column-lg-5{width:calc(5 / 12 * 100%)}sky-column.sky-column-lg-6{width:50%}sky-column.sky-column-lg-7{width:calc(7 / 12 * 100%)}sky-column.sky-column-lg-8{width:calc(8 / 12 * 100%)}sky-column.sky-column-lg-9{width:75%}sky-column.sky-column-lg-10{width:calc(10 / 12 * 100%)}sky-column.sky-column-lg-11{width:calc(11 / 12 * 100%)}sky-column.sky-column-lg-12{width:100%}}.sky-responsive-container-lg sky-column.sky-column-lg-1{width:calc(1 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-2{width:calc(2 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-3{width:25%}.sky-responsive-container-lg sky-column.sky-column-lg-4{width:calc(4 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-5{width:calc(5 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-6{width:50%}.sky-responsive-container-lg sky-column.sky-column-lg-7{width:calc(7 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-8{width:calc(8 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-9{width:75%}.sky-responsive-container-lg sky-column.sky-column-lg-10{width:calc(10 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-11{width:calc(11 / 12 * 100%)}.sky-responsive-container-lg sky-column.sky-column-lg-12{width:100%}\n"] }]
1762
- }], propDecorators: { screenXSmall: [{
1763
- type: Input
1764
- }], screenSmall: [{
1765
- type: Input
1766
- }], screenMedium: [{
1767
- type: Input
1768
- }], screenLarge: [{
1769
- type: Input
1770
- }], classnames: [{
1771
- type: HostBinding,
1772
- args: ['class']
1773
- }] } });
1774
-
1775
- var _SkyFluidGridComponent__gutterSize;
1776
- /**
1777
- * Wraps the fluid grid to ensure proper spacing. Without the wrapper, the
1778
- * alignment, padding, and margins do not behave as expected.
1779
- */
1780
- class SkyFluidGridComponent {
1781
- constructor() {
1782
- /**
1783
- * Disables the outer left and right margin of the fluid grid container.
1784
- * @default false
1785
- */
1786
- this.disableMargin = false;
1787
- _SkyFluidGridComponent__gutterSize.set(this, 'large');
1788
- }
1789
- /**
1790
- * The type that defines the size of the padding
1791
- * between columns.
1792
- * @default "large"
1793
- */
1794
- set gutterSize(value) {
1795
- __classPrivateFieldSet(this, _SkyFluidGridComponent__gutterSize, value ?? 'large', "f");
1796
- }
1797
- get gutterSize() {
1798
- return __classPrivateFieldGet(this, _SkyFluidGridComponent__gutterSize, "f");
1799
- }
1800
- }
1801
- _SkyFluidGridComponent__gutterSize = new WeakMap();
1802
- SkyFluidGridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyFluidGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1803
- SkyFluidGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyFluidGridComponent, selector: "sky-fluid-grid", inputs: { disableMargin: "disableMargin", gutterSize: "gutterSize" }, ngImport: i0, template: "<div\n class=\"sky-fluid-grid\"\n [ngClass]=\"{\n 'sky-fluid-grid-gutter-size-small': gutterSize === 'small',\n 'sky-fluid-grid-gutter-size-medium': gutterSize === 'medium',\n 'sky-fluid-grid-gutter-size-large': gutterSize === 'large',\n 'sky-fluid-grid-no-margin': disableMargin\n }\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [".sky-fluid-grid-gutter-size-small{padding-left:5px;padding-right:5px}.sky-fluid-grid-gutter-size-medium{padding-left:10px;padding-right:10px}.sky-fluid-grid-gutter-size-large{padding-left:15px;padding-right:15px}:host-context(.sky-theme-modern) .sky-fluid-grid-gutter-size-small{padding-left:10px;padding-right:10px}:host-context(.sky-theme-modern) .sky-fluid-grid-gutter-size-medium{padding-left:15px;padding-right:15px}:host-context(.sky-theme-modern) .sky-fluid-grid-gutter-size-large{padding-left:30px;padding-right:30px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
1804
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyFluidGridComponent, decorators: [{
1805
- type: Component,
1806
- args: [{ selector: 'sky-fluid-grid', template: "<div\n class=\"sky-fluid-grid\"\n [ngClass]=\"{\n 'sky-fluid-grid-gutter-size-small': gutterSize === 'small',\n 'sky-fluid-grid-gutter-size-medium': gutterSize === 'medium',\n 'sky-fluid-grid-gutter-size-large': gutterSize === 'large',\n 'sky-fluid-grid-no-margin': disableMargin\n }\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [".sky-fluid-grid-gutter-size-small{padding-left:5px;padding-right:5px}.sky-fluid-grid-gutter-size-medium{padding-left:10px;padding-right:10px}.sky-fluid-grid-gutter-size-large{padding-left:15px;padding-right:15px}:host-context(.sky-theme-modern) .sky-fluid-grid-gutter-size-small{padding-left:10px;padding-right:10px}:host-context(.sky-theme-modern) .sky-fluid-grid-gutter-size-medium{padding-left:15px;padding-right:15px}:host-context(.sky-theme-modern) .sky-fluid-grid-gutter-size-large{padding-left:30px;padding-right:30px}\n"] }]
1807
- }], propDecorators: { disableMargin: [{
1808
- type: Input
1809
- }], gutterSize: [{
1810
- type: Input
1811
- }] } });
1812
-
1813
- /**
1814
- * Displays a row within the `sky-fluid-grid` wrapper. Previously, you could display a row
1815
- * without a wrapper, but we no longer officially support that option.
1816
- */
1817
- class SkyRowComponent {
1818
- constructor() {
1819
- /**
1820
- * Whether to reverse the display order for columns in the row.
1821
- * @default false
1822
- */
1823
- this.reverseColumnOrder = false;
1824
- }
1825
- }
1826
- SkyRowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1827
- SkyRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyRowComponent, selector: "sky-row", inputs: { reverseColumnOrder: "reverseColumnOrder" }, ngImport: i0, template: "<div class=\"sky-row\" [ngClass]=\"{ 'sky-row-reverse': reverseColumnOrder }\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-row{display:flex;flex-direction:row;flex-wrap:wrap;margin-left:-15px;margin-right:-15px}:host-context(.sky-fluid-grid-gutter-size-small) .sky-row{margin-left:-5px;margin-right:-5px}:host-context(.sky-fluid-grid-gutter-size-small.sky-fluid-grid-no-margin) .sky-row{margin-left:-10px;margin-right:-10px}:host-context(.sky-fluid-grid-gutter-size-medium) .sky-row{margin-left:-10px;margin-right:-10px}:host-context(.sky-fluid-grid-gutter-size-medium.sky-fluid-grid-no-margin) .sky-row{margin-left:-20px;margin-right:-20px}:host-context(.sky-fluid-grid-gutter-size-large) .sky-row{margin-left:-15px;margin-right:-15px}:host-context(.sky-fluid-grid-gutter-size-large.sky-fluid-grid-no-margin) .sky-row{margin-left:-30px;margin-right:-30px}:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-small) .sky-row{margin-left:-10px;margin-right:-10px}:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-small.sky-fluid-grid-no-margin) .sky-row{margin-left:-20px;margin-right:-20px}:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-medium) .sky-row{margin-left:-15px;margin-right:-15px}:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-medium.sky-fluid-grid-no-margin) .sky-row{margin-left:-30px;margin-right:-30px}:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-large) .sky-row{margin-left:-30px;margin-right:-30px}:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-large.sky-fluid-grid-no-margin) .sky-row{margin-left:-60px;margin-right:-60px}:host .sky-row.sky-row-reverse{flex-direction:row}:host-context(.sky-responsive-container-xs) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-sm) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-md) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-lg) .sky-row.sky-row-reverse{flex-direction:row}@media (min-width: 768px){:host .sky-row.sky-row-reverse{flex-direction:row-reverse}}:host-context(.sky-responsive-container-sm) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-md) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-lg) .sky-row.sky-row-reverse{flex-direction:row-reverse}:host-context(.sky-theme-modern) .sky-row{margin-left:-30px;margin-right:-30px}.sky-theme-modern .sky-row{margin-left:-30px;margin-right:-30px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
1828
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyRowComponent, decorators: [{
1829
- type: Component,
1830
- args: [{ selector: 'sky-row', template: "<div class=\"sky-row\" [ngClass]=\"{ 'sky-row-reverse': reverseColumnOrder }\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-row{display:flex;flex-direction:row;flex-wrap:wrap;margin-left:-15px;margin-right:-15px}:host-context(.sky-fluid-grid-gutter-size-small) .sky-row{margin-left:-5px;margin-right:-5px}:host-context(.sky-fluid-grid-gutter-size-small.sky-fluid-grid-no-margin) .sky-row{margin-left:-10px;margin-right:-10px}:host-context(.sky-fluid-grid-gutter-size-medium) .sky-row{margin-left:-10px;margin-right:-10px}:host-context(.sky-fluid-grid-gutter-size-medium.sky-fluid-grid-no-margin) .sky-row{margin-left:-20px;margin-right:-20px}:host-context(.sky-fluid-grid-gutter-size-large) .sky-row{margin-left:-15px;margin-right:-15px}:host-context(.sky-fluid-grid-gutter-size-large.sky-fluid-grid-no-margin) .sky-row{margin-left:-30px;margin-right:-30px}:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-small) .sky-row{margin-left:-10px;margin-right:-10px}:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-small.sky-fluid-grid-no-margin) .sky-row{margin-left:-20px;margin-right:-20px}:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-medium) .sky-row{margin-left:-15px;margin-right:-15px}:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-medium.sky-fluid-grid-no-margin) .sky-row{margin-left:-30px;margin-right:-30px}:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-large) .sky-row{margin-left:-30px;margin-right:-30px}:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-large.sky-fluid-grid-no-margin) .sky-row{margin-left:-60px;margin-right:-60px}:host .sky-row.sky-row-reverse{flex-direction:row}:host-context(.sky-responsive-container-xs) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-sm) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-md) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-lg) .sky-row.sky-row-reverse{flex-direction:row}@media (min-width: 768px){:host .sky-row.sky-row-reverse{flex-direction:row-reverse}}:host-context(.sky-responsive-container-sm) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-md) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-lg) .sky-row.sky-row-reverse{flex-direction:row-reverse}:host-context(.sky-theme-modern) .sky-row{margin-left:-30px;margin-right:-30px}.sky-theme-modern .sky-row{margin-left:-30px;margin-right:-30px}\n"] }]
1831
- }], propDecorators: { reverseColumnOrder: [{
1832
- type: Input
1833
- }] } });
1834
-
1835
- class SkyFluidGridModule {
1836
- }
1837
- SkyFluidGridModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyFluidGridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1838
- SkyFluidGridModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyFluidGridModule, declarations: [SkyRowComponent, SkyColumnComponent, SkyFluidGridComponent], imports: [CommonModule], exports: [SkyRowComponent, SkyColumnComponent, SkyFluidGridComponent] });
1839
- SkyFluidGridModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyFluidGridModule, imports: [CommonModule] });
1840
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyFluidGridModule, decorators: [{
1841
- type: NgModule,
1842
- args: [{
1843
- imports: [CommonModule],
1844
- declarations: [SkyRowComponent, SkyColumnComponent, SkyFluidGridComponent],
1845
- exports: [SkyRowComponent, SkyColumnComponent, SkyFluidGridComponent],
1846
- }]
1847
- }] });
1848
-
1849
- var _SkyFormatComponent_instances, _SkyFormatComponent__text, _SkyFormatComponent__args, _SkyFormatComponent_updateItemsForDisplay;
1850
- const tokenRegex = /(\{\d+\})/;
1851
- class SkyFormatComponent {
1852
- constructor() {
1853
- _SkyFormatComponent_instances.add(this);
1854
- this.itemsForDisplay = [];
1855
- _SkyFormatComponent__text.set(this, void 0);
1856
- _SkyFormatComponent__args.set(this, void 0);
1857
- }
1858
- /**
1859
- * The tokenized string that represents the template. Tokens use the `{n}` notation
1860
- * where `n` is the ordinal of the item to replace the token.
1861
- */
1862
- set text(value) {
1863
- __classPrivateFieldSet(this, _SkyFormatComponent__text, value, "f");
1864
- __classPrivateFieldGet(this, _SkyFormatComponent_instances, "m", _SkyFormatComponent_updateItemsForDisplay).call(this);
1865
- }
1866
- get text() {
1867
- return __classPrivateFieldGet(this, _SkyFormatComponent__text, "f");
1868
- }
1869
- /**
1870
- * An array of `TemplateRef` objects to be placed in the template, where the `nth`
1871
- * item is placed at the `{n}` location in the template.
1872
- */
1873
- set args(value) {
1874
- __classPrivateFieldSet(this, _SkyFormatComponent__args, value, "f");
1875
- __classPrivateFieldGet(this, _SkyFormatComponent_instances, "m", _SkyFormatComponent_updateItemsForDisplay).call(this);
1876
- }
1877
- get args() {
1878
- return __classPrivateFieldGet(this, _SkyFormatComponent__args, "f");
1879
- }
1880
- }
1881
- _SkyFormatComponent__text = new WeakMap(), _SkyFormatComponent__args = new WeakMap(), _SkyFormatComponent_instances = new WeakSet(), _SkyFormatComponent_updateItemsForDisplay = function _SkyFormatComponent_updateItemsForDisplay() {
1882
- this.itemsForDisplay = [];
1883
- if (this.text && this.args) {
1884
- const textParts = this.text.split(tokenRegex);
1885
- for (const textPart of textParts) {
1886
- // Disregard empty strings.
1887
- if (textPart) {
1888
- const item = {};
1889
- if (tokenRegex.test(textPart)) {
1890
- const valueIndex = +textPart.substring(1, textPart.length - 1);
1891
- item.templateRef = this.args[valueIndex];
1892
- }
1893
- else {
1894
- item.text = textPart;
1895
- }
1896
- this.itemsForDisplay.push(item);
1897
- }
1898
- }
1899
- }
1900
- };
1901
- SkyFormatComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyFormatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1902
- SkyFormatComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyFormatComponent, selector: "sky-format", inputs: { text: "text", args: "args" }, ngImport: i0, template: "<ng-container *ngFor=\"let item of itemsForDisplay\">\n <ng-container *ngIf=\"item.text\">{{ item.text }}</ng-container>\n <ng-container *ngIf=\"!item.text && item.templateRef\">\n <ng-container *ngTemplateOutlet=\"item.templateRef\"></ng-container>\n </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1903
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyFormatComponent, decorators: [{
1904
- type: Component,
1905
- args: [{ selector: 'sky-format', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let item of itemsForDisplay\">\n <ng-container *ngIf=\"item.text\">{{ item.text }}</ng-container>\n <ng-container *ngIf=\"!item.text && item.templateRef\">\n <ng-container *ngTemplateOutlet=\"item.templateRef\"></ng-container>\n </ng-container>\n</ng-container>\n" }]
1906
- }], propDecorators: { text: [{
1907
- type: Input
1908
- }], args: [{
1909
- type: Input
1910
- }] } });
1911
-
1912
- class SkyFormatModule {
1913
- }
1914
- SkyFormatModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyFormatModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1915
- SkyFormatModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyFormatModule, declarations: [SkyFormatComponent], imports: [CommonModule], exports: [SkyFormatComponent] });
1916
- SkyFormatModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyFormatModule, imports: [CommonModule] });
1917
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyFormatModule, decorators: [{
1918
- type: NgModule,
1919
- args: [{
1920
- declarations: [SkyFormatComponent],
1921
- imports: [CommonModule],
1922
- exports: [SkyFormatComponent],
1923
- }]
1924
- }] });
1925
-
1926
- var _SkyPageThemeAdapterService_styleEl, _SkyPageThemeAdapterService_document;
1927
- /**
1928
- * @internal
1929
- */
1930
- class SkyPageThemeAdapterService {
1931
- constructor(document) {
1932
- _SkyPageThemeAdapterService_styleEl.set(this, void 0);
1933
- _SkyPageThemeAdapterService_document.set(this, void 0);
1934
- __classPrivateFieldSet(this, _SkyPageThemeAdapterService_document, document, "f");
1935
- }
1936
- /**
1937
- * We can't use ViewEncapsulation.None for this behavior because Angular does
1938
- * not remove `style` tags from the HEAD element after route changes.
1939
- * @see https://github.com/angular/angular/issues/16670
1940
- */
1941
- addTheme() {
1942
- if (!__classPrivateFieldGet(this, _SkyPageThemeAdapterService_styleEl, "f")) {
1943
- __classPrivateFieldSet(this, _SkyPageThemeAdapterService_styleEl, __classPrivateFieldGet(this, _SkyPageThemeAdapterService_document, "f").createElement('style'), "f");
1944
- __classPrivateFieldGet(this, _SkyPageThemeAdapterService_styleEl, "f").appendChild(__classPrivateFieldGet(this, _SkyPageThemeAdapterService_document, "f").createTextNode('body:not(.sky-theme-modern) { background-color: #fff; }'));
1945
- __classPrivateFieldGet(this, _SkyPageThemeAdapterService_document, "f").head.appendChild(__classPrivateFieldGet(this, _SkyPageThemeAdapterService_styleEl, "f"));
1946
- }
1947
- }
1948
- removeTheme() {
1949
- if (__classPrivateFieldGet(this, _SkyPageThemeAdapterService_styleEl, "f")) {
1950
- __classPrivateFieldGet(this, _SkyPageThemeAdapterService_styleEl, "f").remove();
1951
- __classPrivateFieldSet(this, _SkyPageThemeAdapterService_styleEl, undefined, "f");
1952
- }
1953
- }
1954
- }
1955
- _SkyPageThemeAdapterService_styleEl = new WeakMap(), _SkyPageThemeAdapterService_document = new WeakMap();
1956
- SkyPageThemeAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageThemeAdapterService, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
1957
- SkyPageThemeAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageThemeAdapterService });
1958
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageThemeAdapterService, decorators: [{
1959
- type: Injectable
1960
- }], ctorParameters: function () { return [{ type: Document, decorators: [{
1961
- type: Inject,
1962
- args: [DOCUMENT]
1963
- }] }]; } });
1964
-
1965
- var _SkyPageComponent_themeAdapter, _SkyPageComponent__layout, _SkyPageComponent_logger;
1966
- /**
1967
- * Displays page contents using the specified layout.
1968
- * @deprecated Use the `sky-page` component in `@skyux/pages` instead.
1969
- */
1970
- class SkyPageComponent {
1971
- /**
1972
- * The page layout. Use `auto` to allow the page contents
1973
- * to expand beyond the bottom of the browser window. Use `fit`
1974
- * to constrain the page contents to the available viewport.
1975
- */
1976
- set layout(value) {
1977
- __classPrivateFieldSet(this, _SkyPageComponent__layout, value || 'auto', "f");
1978
- }
1979
- get layout() {
1980
- return __classPrivateFieldGet(this, _SkyPageComponent__layout, "f");
1981
- }
1982
- constructor(themeAdapter) {
1983
- _SkyPageComponent_themeAdapter.set(this, void 0);
1984
- _SkyPageComponent__layout.set(this, 'auto');
1985
- _SkyPageComponent_logger.set(this, inject(SkyLogService));
1986
- __classPrivateFieldGet(this, _SkyPageComponent_logger, "f").deprecated('SkyPageComponent', {
1987
- deprecationMajorVersion: 8,
1988
- moreInfoUrl: 'https://developer.blackbaud.com/skyux/components/page',
1989
- replacementRecommendation: 'Use the `sky-page` component in `@skyux/pages` instead.',
1990
- });
1991
- __classPrivateFieldSet(this, _SkyPageComponent_themeAdapter, themeAdapter, "f");
1992
- }
1993
- ngOnInit() {
1994
- __classPrivateFieldGet(this, _SkyPageComponent_themeAdapter, "f").addTheme();
1995
- }
1996
- ngOnDestroy() {
1997
- __classPrivateFieldGet(this, _SkyPageComponent_themeAdapter, "f").removeTheme();
1998
- }
1999
- }
2000
- _SkyPageComponent_themeAdapter = new WeakMap(), _SkyPageComponent__layout = new WeakMap(), _SkyPageComponent_logger = new WeakMap();
2001
- SkyPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageComponent, deps: [{ token: SkyPageThemeAdapterService }], target: i0.ɵɵFactoryTarget.Component });
2002
- SkyPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyPageComponent, selector: "sky-page", inputs: { layout: "layout" }, providers: [SkyPageThemeAdapterService], ngImport: i0, template: "<div [ngClass]=\"'sky-layout-host-' + layout\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-layout-host-fit{position:absolute;left:var(--sky-viewport-left);top:var(--sky-viewport-top);right:var(--sky-viewport-right);bottom:var(--sky-viewport-bottom)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
2003
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageComponent, decorators: [{
2004
- type: Component,
2005
- args: [{ selector: 'sky-page', providers: [SkyPageThemeAdapterService], template: "<div [ngClass]=\"'sky-layout-host-' + layout\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-layout-host-fit{position:absolute;left:var(--sky-viewport-left);top:var(--sky-viewport-top);right:var(--sky-viewport-right);bottom:var(--sky-viewport-bottom)}\n"] }]
2006
- }], ctorParameters: function () { return [{ type: SkyPageThemeAdapterService }]; }, propDecorators: { layout: [{
2007
- type: Input
2008
- }] } });
2009
-
2010
- /**
2011
- * @deprecated Use the SkyPageModule in `@skyux/pages` instead.
2012
- */
2013
- class SkyPageModule {
2014
- }
2015
- SkyPageModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2016
- SkyPageModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyPageModule, declarations: [SkyPageComponent], imports: [CommonModule], exports: [SkyPageComponent] });
2017
- SkyPageModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageModule, imports: [CommonModule] });
2018
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageModule, decorators: [{
2019
- type: NgModule,
2020
- args: [{
2021
- declarations: [SkyPageComponent],
2022
- imports: [CommonModule],
2023
- exports: [SkyPageComponent],
2024
- }]
2025
- }] });
2026
-
2027
- /**
2028
- * Displays messages that require immediate attention as [alerts](https://developer.blackbaud.com/skyux/components/alert) within
2029
- * the page summary.
2030
- * @deprecated
2031
- */
2032
- /* istanbul ignore next */
2033
- /* Code coverage having problems with no statements in classes */
2034
- class SkyPageSummaryAlertComponent {
2035
- }
2036
- SkyPageSummaryAlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2037
- SkyPageSummaryAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyPageSummaryAlertComponent, selector: "sky-page-summary-alert", ngImport: i0, template: "<ng-content></ng-content>\n", styles: ["::ng-deep .sky-alert{margin-top:0;margin-bottom:20px;line-height:initial}\n"] });
2038
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryAlertComponent, decorators: [{
2039
- type: Component,
2040
- args: [{ selector: 'sky-page-summary-alert', template: "<ng-content></ng-content>\n", styles: ["::ng-deep .sky-alert{margin-top:0;margin-bottom:20px;line-height:initial}\n"] }]
2041
- }] });
2042
-
2043
- /**
2044
- * Displays content in the arbitrary section of the page summary.
2045
- * @deprecated
2046
- */
2047
- /* istanbul ignore next */
2048
- /* Code coverage having problems with no statements in classes */
2049
- class SkyPageSummaryContentComponent {
2050
- }
2051
- SkyPageSummaryContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2052
- SkyPageSummaryContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyPageSummaryContentComponent, selector: "sky-page-summary-content", ngImport: i0, template: "<div class=\"sky-page-summary-content\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-page-summary-content{margin-top:20px}\n"] });
2053
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryContentComponent, decorators: [{
2054
- type: Component,
2055
- args: [{ selector: 'sky-page-summary-content', template: "<div class=\"sky-page-summary-content\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-page-summary-content{margin-top:20px}\n"] }]
2056
- }] });
2057
-
2058
- /**
2059
- * Displays an image in the page summary to identify a record
2060
- * or help users complete a core task.
2061
- * @deprecated
2062
- */
2063
- /* istanbul ignore next */
2064
- /* Code coverage having problems with no statements in classes */
2065
- class SkyPageSummaryImageComponent {
2066
- }
2067
- SkyPageSummaryImageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2068
- SkyPageSummaryImageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyPageSummaryImageComponent, selector: "sky-page-summary-image", ngImport: i0, template: "<div class=\"sky-page-summary-image\">\n <ng-content></ng-content>\n</div>\n", styles: [":host .sky-page-summary-image{width:100px;margin-left:auto;margin-right:auto;margin-bottom:10px}:host-context(.sky-responsive-container-xs) .sky-page-summary-image,:host-context(.sky-responsive-container-sm) .sky-page-summary-image,:host-context(.sky-responsive-container-md) .sky-page-summary-image,:host-context(.sky-responsive-container-lg) .sky-page-summary-image{width:100px;margin-left:auto;margin-right:auto;margin-bottom:10px}@media (min-width: 768px){:host .sky-page-summary-image{width:120px;flex:0 0 120px;margin:initial}}:host-context(.sky-responsive-container-sm) .sky-page-summary-image,:host-context(.sky-responsive-container-md) .sky-page-summary-image,:host-context(.sky-responsive-container-lg) .sky-page-summary-image{width:120px;flex:0 0 120px;margin:initial}\n"] });
2069
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryImageComponent, decorators: [{
2070
- type: Component,
2071
- args: [{ selector: 'sky-page-summary-image', template: "<div class=\"sky-page-summary-image\">\n <ng-content></ng-content>\n</div>\n", styles: [":host .sky-page-summary-image{width:100px;margin-left:auto;margin-right:auto;margin-bottom:10px}:host-context(.sky-responsive-container-xs) .sky-page-summary-image,:host-context(.sky-responsive-container-sm) .sky-page-summary-image,:host-context(.sky-responsive-container-md) .sky-page-summary-image,:host-context(.sky-responsive-container-lg) .sky-page-summary-image{width:100px;margin-left:auto;margin-right:auto;margin-bottom:10px}@media (min-width: 768px){:host .sky-page-summary-image{width:120px;flex:0 0 120px;margin:initial}}:host-context(.sky-responsive-container-sm) .sky-page-summary-image,:host-context(.sky-responsive-container-md) .sky-page-summary-image,:host-context(.sky-responsive-container-lg) .sky-page-summary-image{width:120px;flex:0 0 120px;margin:initial}\n"] }]
2072
- }] });
2073
-
2074
- /**
2075
- * Highlights important information about a page in the key information section of the
2076
- * page summary.
2077
- * @deprecated
2078
- */
2079
- class SkyPageSummaryKeyInfoComponent {
2080
- }
2081
- SkyPageSummaryKeyInfoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryKeyInfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2082
- SkyPageSummaryKeyInfoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyPageSummaryKeyInfoComponent, selector: "sky-page-summary-key-info", ngImport: i0, template: "<div class=\"sky-page-summary-key-info\">\n <ng-content></ng-content>\n</div>\n", styles: [":host .sky-page-summary-key-info{margin-top:20px}:host-context(.sky-responsive-container-xs) .sky-page-summary-key-info,:host-context(.sky-responsive-container-sm) .sky-page-summary-key-info,:host-context(.sky-responsive-container-md) .sky-page-summary-key-info,:host-context(.sky-responsive-container-lg) .sky-page-summary-key-info{margin-top:20px}@media (min-width: 768px){:host .sky-page-summary-key-info{margin-top:initial}}:host-context(.sky-responsive-container-sm) .sky-page-summary-key-info,:host-context(.sky-responsive-container-md) .sky-page-summary-key-info,:host-context(.sky-responsive-container-lg) .sky-page-summary-key-info{margin-top:initial}.sky-page-summary-key-info ::ng-deep .sky-key-info{display:block}\n"] });
2083
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryKeyInfoComponent, decorators: [{
2084
- type: Component,
2085
- args: [{ selector: 'sky-page-summary-key-info', template: "<div class=\"sky-page-summary-key-info\">\n <ng-content></ng-content>\n</div>\n", styles: [":host .sky-page-summary-key-info{margin-top:20px}:host-context(.sky-responsive-container-xs) .sky-page-summary-key-info,:host-context(.sky-responsive-container-sm) .sky-page-summary-key-info,:host-context(.sky-responsive-container-md) .sky-page-summary-key-info,:host-context(.sky-responsive-container-lg) .sky-page-summary-key-info{margin-top:20px}@media (min-width: 768px){:host .sky-page-summary-key-info{margin-top:initial}}:host-context(.sky-responsive-container-sm) .sky-page-summary-key-info,:host-context(.sky-responsive-container-md) .sky-page-summary-key-info,:host-context(.sky-responsive-container-lg) .sky-page-summary-key-info{margin-top:initial}.sky-page-summary-key-info ::ng-deep .sky-key-info{display:block}\n"] }]
2086
- }] });
2087
-
2088
- /**
2089
- * Displays [labels](https://developer.blackbaud.com/skyux/components/label)
2090
- * to highlight important status information about a page's content.
2091
- * @deprecated
2092
- */
2093
- /* istanbul ignore next */
2094
- /* Code coverage having problems with no statements in classes */
2095
- class SkyPageSummaryStatusComponent {
2096
- }
2097
- SkyPageSummaryStatusComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2098
- SkyPageSummaryStatusComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyPageSummaryStatusComponent, selector: "sky-page-summary-status", ngImport: i0, template: "<div class=\"sky-page-summary-status\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-page-summary-status{margin-top:10px}.sky-page-summary-status ::ng-deep .sky-label{margin-right:5px}\n"] });
2099
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryStatusComponent, decorators: [{
2100
- type: Component,
2101
- args: [{ selector: 'sky-page-summary-status', template: "<div class=\"sky-page-summary-status\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-page-summary-status{margin-top:10px}.sky-page-summary-status ::ng-deep .sky-label{margin-right:5px}\n"] }]
2102
- }] });
2103
-
2104
- /**
2105
- * Specifies a subtitle to identify the page content.
2106
- * @deprecated
2107
- */
2108
- /* istanbul ignore next */
2109
- /* Code coverage having problems with no statements in classes */
2110
- class SkyPageSummarySubtitleComponent {
2111
- }
2112
- SkyPageSummarySubtitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummarySubtitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2113
- SkyPageSummarySubtitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyPageSummarySubtitleComponent, selector: "sky-page-summary-subtitle", ngImport: i0, template: "<p class=\"sky-page-summary-subtitle sky-emphasized\">\n <ng-content></ng-content>\n</p>\n", styles: [".sky-page-summary-subtitle{margin-top:0;margin-bottom:10px;line-height:1.1}\n"] });
2114
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummarySubtitleComponent, decorators: [{
2115
- type: Component,
2116
- args: [{ selector: 'sky-page-summary-subtitle', template: "<p class=\"sky-page-summary-subtitle sky-emphasized\">\n <ng-content></ng-content>\n</p>\n", styles: [".sky-page-summary-subtitle{margin-top:0;margin-bottom:10px;line-height:1.1}\n"] }]
2117
- }] });
2118
-
2119
- /**
2120
- * Specifies a title to identify the page content.
2121
- * @deprecated
2122
- */
2123
- /* istanbul ignore next */
2124
- /* Code coverage having problems with no statements in classes */
2125
- class SkyPageSummaryTitleComponent {
2126
- }
2127
- SkyPageSummaryTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2128
- SkyPageSummaryTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyPageSummaryTitleComponent, selector: "sky-page-summary-title", ngImport: i0, template: "<h1 class=\"sky-page-summary-title sky-page-heading\">\n <ng-content></ng-content>\n</h1>\n", styles: [".sky-page-summary-title{margin-top:0;margin-bottom:5px}\n"] });
2129
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryTitleComponent, decorators: [{
2130
- type: Component,
2131
- args: [{ selector: 'sky-page-summary-title', template: "<h1 class=\"sky-page-summary-title sky-page-heading\">\n <ng-content></ng-content>\n</h1>\n", styles: [".sky-page-summary-title{margin-top:0;margin-bottom:5px}\n"] }]
2132
- }] });
2133
-
2134
- /**
2135
- * @internal
2136
- */
2137
- class SkyPageSummaryAdapterService {
2138
- updateKeyInfoLocation(elRef, isXS) {
2139
- const el = elRef.nativeElement;
2140
- const keyInfoContainerEl = el.querySelector('.sky-page-summary-key-info-container');
2141
- if (isXS) {
2142
- el.querySelector('.sky-page-summary-key-info-xs').appendChild(keyInfoContainerEl);
2143
- }
2144
- else {
2145
- el.querySelector('.sky-page-summary-key-info-sm').appendChild(keyInfoContainerEl);
2146
- }
2147
- }
2148
- }
2149
- SkyPageSummaryAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryAdapterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
2150
- SkyPageSummaryAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryAdapterService });
2151
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryAdapterService, decorators: [{
2152
- type: Injectable
2153
- }] });
2154
-
2155
- var _SkyPageSummaryComponent_breakpointSubscription, _SkyPageSummaryComponent_ngUnsubscribe, _SkyPageSummaryComponent_elRef, _SkyPageSummaryComponent_adapter, _SkyPageSummaryComponent_mediaQueryService, _SkyPageSummaryComponent_changeDetectorRef;
2156
- /**
2157
- * Specifies the components to display in the page summary.
2158
- * @deprecated `SkyPageSummaryComponent` is deprecated. For page templates and techniques to summarize page content, see the page design guidelines. For more information, see https://developer.blackbaud.com/skyux/design/guidelines/page-layouts.
2159
- */
2160
- class SkyPageSummaryComponent {
2161
- constructor(elRef, adapter, mediaQueryService, logger, changeDetector) {
2162
- this.hasKeyInfo = false;
2163
- _SkyPageSummaryComponent_breakpointSubscription.set(this, void 0);
2164
- _SkyPageSummaryComponent_ngUnsubscribe.set(this, new Subject());
2165
- _SkyPageSummaryComponent_elRef.set(this, void 0);
2166
- _SkyPageSummaryComponent_adapter.set(this, void 0);
2167
- _SkyPageSummaryComponent_mediaQueryService.set(this, void 0);
2168
- _SkyPageSummaryComponent_changeDetectorRef.set(this, void 0);
2169
- __classPrivateFieldSet(this, _SkyPageSummaryComponent_elRef, elRef, "f");
2170
- __classPrivateFieldSet(this, _SkyPageSummaryComponent_adapter, adapter, "f");
2171
- __classPrivateFieldSet(this, _SkyPageSummaryComponent_mediaQueryService, mediaQueryService, "f");
2172
- __classPrivateFieldSet(this, _SkyPageSummaryComponent_changeDetectorRef, changeDetector, "f");
2173
- logger.deprecated('SkyPageSummaryComponent', {
2174
- deprecationMajorVersion: 6,
2175
- moreInfoUrl: 'https://developer.blackbaud.com/skyux/design/guidelines/page-layouts',
2176
- replacementRecommendation: 'For page templates and techniques to summarize page content, see the page design guidelines.',
2177
- });
2178
- }
2179
- ngAfterViewInit() {
2180
- __classPrivateFieldSet(this, _SkyPageSummaryComponent_breakpointSubscription, __classPrivateFieldGet(this, _SkyPageSummaryComponent_mediaQueryService, "f").subscribe((args) => {
2181
- __classPrivateFieldGet(this, _SkyPageSummaryComponent_adapter, "f").updateKeyInfoLocation(__classPrivateFieldGet(this, _SkyPageSummaryComponent_elRef, "f"), args === SkyMediaBreakpoints.xs);
2182
- }), "f");
2183
- }
2184
- ngAfterContentInit() {
2185
- if (this.keyInfoComponents) {
2186
- this.hasKeyInfo = this.keyInfoComponents.length > 0;
2187
- this.keyInfoComponents.changes
2188
- .pipe(takeUntil(__classPrivateFieldGet(this, _SkyPageSummaryComponent_ngUnsubscribe, "f")))
2189
- .subscribe(() => {
2190
- this.hasKeyInfo =
2191
- !!this.keyInfoComponents && this.keyInfoComponents.length > 0;
2192
- __classPrivateFieldGet(this, _SkyPageSummaryComponent_changeDetectorRef, "f").markForCheck();
2193
- });
2194
- }
2195
- }
2196
- ngOnDestroy() {
2197
- /* istanbul ignore else */
2198
- /* sanity check */
2199
- if (__classPrivateFieldGet(this, _SkyPageSummaryComponent_breakpointSubscription, "f")) {
2200
- __classPrivateFieldGet(this, _SkyPageSummaryComponent_breakpointSubscription, "f").unsubscribe();
2201
- }
2202
- __classPrivateFieldGet(this, _SkyPageSummaryComponent_ngUnsubscribe, "f").next();
2203
- __classPrivateFieldGet(this, _SkyPageSummaryComponent_ngUnsubscribe, "f").complete();
2204
- }
2205
- }
2206
- _SkyPageSummaryComponent_breakpointSubscription = new WeakMap(), _SkyPageSummaryComponent_ngUnsubscribe = new WeakMap(), _SkyPageSummaryComponent_elRef = new WeakMap(), _SkyPageSummaryComponent_adapter = new WeakMap(), _SkyPageSummaryComponent_mediaQueryService = new WeakMap(), _SkyPageSummaryComponent_changeDetectorRef = new WeakMap();
2207
- SkyPageSummaryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryComponent, deps: [{ token: i0.ElementRef }, { token: SkyPageSummaryAdapterService }, { token: i1$2.SkyMediaQueryService }, { token: i1$2.SkyLogService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
2208
- SkyPageSummaryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyPageSummaryComponent, selector: "sky-page-summary", providers: [SkyPageSummaryAdapterService], queries: [{ propertyName: "keyInfoComponents", predicate: SkyPageSummaryKeyInfoComponent, read: SkyPageSummaryKeyInfoComponent }], ngImport: i0, template: "<div\n class=\"sky-page-summary\"\n [ngClass]=\"{ 'sky-page-summary-with-key-info': hasKeyInfo }\"\n>\n <ng-content select=\"sky-page-summary-alert\"></ng-content>\n <div class=\"sky-page-summary-row\">\n <div class=\"sky-page-summary-left\">\n <ng-content select=\"sky-page-summary-image\"></ng-content>\n <div class=\"sky-page-summary-data\">\n <ng-content select=\"sky-page-summary-title\"></ng-content>\n <ng-content select=\"sky-page-summary-subtitle\"></ng-content>\n <ng-content select=\"sky-page-summary-status\"></ng-content>\n <div class=\"sky-page-summary-key-info-xs\"></div>\n <ng-content select=\"sky-page-summary-content\"></ng-content>\n </div>\n </div>\n <div class=\"sky-page-summary-key-info-sm\">\n <div class=\"sky-page-summary-key-info-container\">\n <ng-content select=\"sky-page-summary-key-info\"></ng-content>\n </div>\n </div>\n </div>\n</div>\n", styles: [".sky-page-summary{background-color:#fff;padding:20px 15px}.sky-page-summary-row{align-items:stretch;display:flex}:host .sky-page-summary-left{flex-basis:100%;display:initial;align-items:initial}:host .sky-page-summary-with-key-info .sky-page-summary-left{flex-basis:100%;padding-right:initial}:host-context(.sky-responsive-container-xs) .sky-page-summary-left,:host-context(.sky-responsive-container-sm) .sky-page-summary-left,:host-context(.sky-responsive-container-md) .sky-page-summary-left,:host-context(.sky-responsive-container-lg) .sky-page-summary-left{flex-basis:100%;display:initial;align-items:initial}:host-context(.sky-responsive-container-xs) .sky-page-summary-with-key-info .sky-page-summary-left,:host-context(.sky-responsive-container-sm) .sky-page-summary-with-key-info .sky-page-summary-left,:host-context(.sky-responsive-container-md) .sky-page-summary-with-key-info .sky-page-summary-left,:host-context(.sky-responsive-container-lg) .sky-page-summary-with-key-info .sky-page-summary-left{flex-basis:100%;padding-right:initial}@media (min-width: 768px){:host .sky-page-summary-with-key-info .sky-page-summary-left{flex-basis:75%;padding-right:15px}:host .sky-page-summary-with-key-info .sky-page-summary-right{flex-basis:25%}:host .sky-page-summary-left{align-items:stretch;display:flex}:host .sky-page-summary-data{flex-grow:1}}:host-context(.sky-responsive-container-sm) .sky-page-summary-with-key-info .sky-page-summary-left,:host-context(.sky-responsive-container-md) .sky-page-summary-with-key-info .sky-page-summary-left,:host-context(.sky-responsive-container-lg) .sky-page-summary-with-key-info .sky-page-summary-left{flex-basis:75%;padding-right:15px}:host-context(.sky-responsive-container-sm) .sky-page-summary-with-key-info .sky-page-summary-right,:host-context(.sky-responsive-container-md) .sky-page-summary-with-key-info .sky-page-summary-right,:host-context(.sky-responsive-container-lg) .sky-page-summary-with-key-info .sky-page-summary-right{flex-basis:25%}:host-context(.sky-responsive-container-sm) .sky-page-summary-left,:host-context(.sky-responsive-container-md) .sky-page-summary-left,:host-context(.sky-responsive-container-lg) .sky-page-summary-left{align-items:stretch;display:flex}:host-context(.sky-responsive-container-sm) .sky-page-summary-data,:host-context(.sky-responsive-container-md) .sky-page-summary-data,:host-context(.sky-responsive-container-lg) .sky-page-summary-data{flex-grow:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
2209
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryComponent, decorators: [{
2210
- type: Component,
2211
- args: [{ selector: 'sky-page-summary', providers: [SkyPageSummaryAdapterService], template: "<div\n class=\"sky-page-summary\"\n [ngClass]=\"{ 'sky-page-summary-with-key-info': hasKeyInfo }\"\n>\n <ng-content select=\"sky-page-summary-alert\"></ng-content>\n <div class=\"sky-page-summary-row\">\n <div class=\"sky-page-summary-left\">\n <ng-content select=\"sky-page-summary-image\"></ng-content>\n <div class=\"sky-page-summary-data\">\n <ng-content select=\"sky-page-summary-title\"></ng-content>\n <ng-content select=\"sky-page-summary-subtitle\"></ng-content>\n <ng-content select=\"sky-page-summary-status\"></ng-content>\n <div class=\"sky-page-summary-key-info-xs\"></div>\n <ng-content select=\"sky-page-summary-content\"></ng-content>\n </div>\n </div>\n <div class=\"sky-page-summary-key-info-sm\">\n <div class=\"sky-page-summary-key-info-container\">\n <ng-content select=\"sky-page-summary-key-info\"></ng-content>\n </div>\n </div>\n </div>\n</div>\n", styles: [".sky-page-summary{background-color:#fff;padding:20px 15px}.sky-page-summary-row{align-items:stretch;display:flex}:host .sky-page-summary-left{flex-basis:100%;display:initial;align-items:initial}:host .sky-page-summary-with-key-info .sky-page-summary-left{flex-basis:100%;padding-right:initial}:host-context(.sky-responsive-container-xs) .sky-page-summary-left,:host-context(.sky-responsive-container-sm) .sky-page-summary-left,:host-context(.sky-responsive-container-md) .sky-page-summary-left,:host-context(.sky-responsive-container-lg) .sky-page-summary-left{flex-basis:100%;display:initial;align-items:initial}:host-context(.sky-responsive-container-xs) .sky-page-summary-with-key-info .sky-page-summary-left,:host-context(.sky-responsive-container-sm) .sky-page-summary-with-key-info .sky-page-summary-left,:host-context(.sky-responsive-container-md) .sky-page-summary-with-key-info .sky-page-summary-left,:host-context(.sky-responsive-container-lg) .sky-page-summary-with-key-info .sky-page-summary-left{flex-basis:100%;padding-right:initial}@media (min-width: 768px){:host .sky-page-summary-with-key-info .sky-page-summary-left{flex-basis:75%;padding-right:15px}:host .sky-page-summary-with-key-info .sky-page-summary-right{flex-basis:25%}:host .sky-page-summary-left{align-items:stretch;display:flex}:host .sky-page-summary-data{flex-grow:1}}:host-context(.sky-responsive-container-sm) .sky-page-summary-with-key-info .sky-page-summary-left,:host-context(.sky-responsive-container-md) .sky-page-summary-with-key-info .sky-page-summary-left,:host-context(.sky-responsive-container-lg) .sky-page-summary-with-key-info .sky-page-summary-left{flex-basis:75%;padding-right:15px}:host-context(.sky-responsive-container-sm) .sky-page-summary-with-key-info .sky-page-summary-right,:host-context(.sky-responsive-container-md) .sky-page-summary-with-key-info .sky-page-summary-right,:host-context(.sky-responsive-container-lg) .sky-page-summary-with-key-info .sky-page-summary-right{flex-basis:25%}:host-context(.sky-responsive-container-sm) .sky-page-summary-left,:host-context(.sky-responsive-container-md) .sky-page-summary-left,:host-context(.sky-responsive-container-lg) .sky-page-summary-left{align-items:stretch;display:flex}:host-context(.sky-responsive-container-sm) .sky-page-summary-data,:host-context(.sky-responsive-container-md) .sky-page-summary-data,:host-context(.sky-responsive-container-lg) .sky-page-summary-data{flex-grow:1}\n"] }]
2212
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: SkyPageSummaryAdapterService }, { type: i1$2.SkyMediaQueryService }, { type: i1$2.SkyLogService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { keyInfoComponents: [{
2213
- type: ContentChildren,
2214
- args: [SkyPageSummaryKeyInfoComponent, {
2215
- read: SkyPageSummaryKeyInfoComponent,
2216
- }]
2217
- }] } });
2218
-
2219
- /**
2220
- * @deprecated `SkyPageSummaryModule` is deprecated. For page templates and techniques to summarize page content, see the page design guidelines. For more information, see https://developer.blackbaud.com/skyux/design/guidelines/page-layouts.
2221
- */
2222
- class SkyPageSummaryModule {
2223
- }
2224
- SkyPageSummaryModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2225
- SkyPageSummaryModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryModule, declarations: [SkyPageSummaryAlertComponent,
2226
- SkyPageSummaryComponent,
2227
- SkyPageSummaryContentComponent,
2228
- SkyPageSummaryImageComponent,
2229
- SkyPageSummaryKeyInfoComponent,
2230
- SkyPageSummaryStatusComponent,
2231
- SkyPageSummarySubtitleComponent,
2232
- SkyPageSummaryTitleComponent], imports: [CommonModule], exports: [SkyPageSummaryAlertComponent,
2233
- SkyPageSummaryComponent,
2234
- SkyPageSummaryContentComponent,
2235
- SkyPageSummaryImageComponent,
2236
- SkyPageSummaryKeyInfoComponent,
2237
- SkyPageSummaryStatusComponent,
2238
- SkyPageSummarySubtitleComponent,
2239
- SkyPageSummaryTitleComponent] });
2240
- SkyPageSummaryModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryModule, imports: [CommonModule] });
2241
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyPageSummaryModule, decorators: [{
2242
- type: NgModule,
2243
- args: [{
2244
- declarations: [
2245
- SkyPageSummaryAlertComponent,
2246
- SkyPageSummaryComponent,
2247
- SkyPageSummaryContentComponent,
2248
- SkyPageSummaryImageComponent,
2249
- SkyPageSummaryKeyInfoComponent,
2250
- SkyPageSummaryStatusComponent,
2251
- SkyPageSummarySubtitleComponent,
2252
- SkyPageSummaryTitleComponent,
2253
- ],
2254
- imports: [CommonModule],
2255
- exports: [
2256
- SkyPageSummaryAlertComponent,
2257
- SkyPageSummaryComponent,
2258
- SkyPageSummaryContentComponent,
2259
- SkyPageSummaryImageComponent,
2260
- SkyPageSummaryKeyInfoComponent,
2261
- SkyPageSummaryStatusComponent,
2262
- SkyPageSummarySubtitleComponent,
2263
- SkyPageSummaryTitleComponent,
2264
- ],
2265
- }]
2266
- }] });
2267
-
2268
- /**
2269
- * @internal
2270
- */
2271
- const SKY_TEXT_EXPAND_MODAL_CONTEXT = new InjectionToken('SkyTextExpandModalContext');
2272
-
2273
- /**
2274
- * @internal
2275
- */
2276
- class SkyTextExpandModalComponent {
2277
- constructor(context, instance) {
2278
- this.context = context;
2279
- this.instance = instance;
2280
- }
2281
- close() {
2282
- this.instance.close();
2283
- }
2284
- }
2285
- SkyTextExpandModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandModalComponent, deps: [{ token: SKY_TEXT_EXPAND_MODAL_CONTEXT }, { token: i1$4.SkyModalInstance }], target: i0.ɵɵFactoryTarget.Component });
2286
- SkyTextExpandModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyTextExpandModalComponent, selector: "sky-text-expand-modal", ngImport: i0, template: "<sky-modal>\n <sky-modal-header>{{ context.header }}</sky-modal-header>\n <sky-modal-content class=\"sky-text-expand-modal-content\">{{\n context.text\n }}</sky-modal-content>\n <sky-modal-footer>\n <button class=\"sky-btn sky-btn-link\" (click)=\"close()\">\n {{ 'skyux_text_expand_close_text' | skyLibResources }}\n </button>\n </sky-modal-footer>\n</sky-modal>\n", styles: [".sky-text-expand-ellipsis{letter-spacing:2px;white-space:nowrap}.sky-text-expand-space{white-space:normal}.sky-text-expand-see-more{white-space:nowrap;margin-left:5px}.sky-text-expand-text{margin:0;white-space:pre-wrap}.sky-text-expand-container{word-break:break-word;word-wrap:break-word;overflow:hidden;height:auto}.sky-text-expand-modal-content{white-space:pre-line;word-wrap:break-word}\n"], dependencies: [{ kind: "component", type: i1$4.λ5, selector: "sky-modal", inputs: ["formErrors", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy"] }, { kind: "component", type: i1$4.λ2, selector: "sky-modal-content" }, { kind: "component", type: i1$4.λ3, selector: "sky-modal-footer" }, { kind: "component", type: i1$4.λ4, selector: "sky-modal-header" }, { kind: "pipe", type: i1$3.SkyLibResourcesPipe, name: "skyLibResources" }] });
2287
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandModalComponent, decorators: [{
2288
- type: Component,
2289
- args: [{ selector: 'sky-text-expand-modal', template: "<sky-modal>\n <sky-modal-header>{{ context.header }}</sky-modal-header>\n <sky-modal-content class=\"sky-text-expand-modal-content\">{{\n context.text\n }}</sky-modal-content>\n <sky-modal-footer>\n <button class=\"sky-btn sky-btn-link\" (click)=\"close()\">\n {{ 'skyux_text_expand_close_text' | skyLibResources }}\n </button>\n </sky-modal-footer>\n</sky-modal>\n", styles: [".sky-text-expand-ellipsis{letter-spacing:2px;white-space:nowrap}.sky-text-expand-space{white-space:normal}.sky-text-expand-see-more{white-space:nowrap;margin-left:5px}.sky-text-expand-text{margin:0;white-space:pre-wrap}.sky-text-expand-container{word-break:break-word;word-wrap:break-word;overflow:hidden;height:auto}.sky-text-expand-modal-content{white-space:pre-line;word-wrap:break-word}\n"] }]
2290
- }], ctorParameters: function () { return [{ type: undefined, decorators: [{
2291
- type: Inject,
2292
- args: [SKY_TEXT_EXPAND_MODAL_CONTEXT]
2293
- }] }, { type: i1$4.SkyModalInstance }]; } });
2294
-
2295
- var _SkyTextExpandAdapterService_renderer;
2296
- /**
2297
- * @internal
2298
- */
2299
- class SkyTextExpandAdapterService {
2300
- constructor(rendererFactory) {
2301
- _SkyTextExpandAdapterService_renderer.set(this, void 0);
2302
- __classPrivateFieldSet(this, _SkyTextExpandAdapterService_renderer, rendererFactory.createRenderer(undefined, null), "f");
2303
- }
2304
- getContainerHeight(containerEl) {
2305
- return containerEl.nativeElement.offsetHeight;
2306
- }
2307
- removeContainerMaxHeight(containerEl) {
2308
- __classPrivateFieldGet(this, _SkyTextExpandAdapterService_renderer, "f").removeStyle(containerEl.nativeElement, 'max-height');
2309
- }
2310
- setText(textEl, text) {
2311
- textEl.nativeElement.textContent = text;
2312
- }
2313
- }
2314
- _SkyTextExpandAdapterService_renderer = new WeakMap();
2315
- SkyTextExpandAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandAdapterService, deps: [{ token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
2316
- SkyTextExpandAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandAdapterService });
2317
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandAdapterService, decorators: [{
2318
- type: Injectable
2319
- }], ctorParameters: function () { return [{ type: i0.RendererFactory2 }]; } });
2320
-
2321
- var _SkyTextExpandComponent_instances, _SkyTextExpandComponent_collapsedText, _SkyTextExpandComponent_newlineCount, _SkyTextExpandComponent_seeMoreText, _SkyTextExpandComponent_seeLessText, _SkyTextExpandComponent_textToShow, _SkyTextExpandComponent__maxExpandedLength, _SkyTextExpandComponent__maxExpandedNewlines, _SkyTextExpandComponent__maxLength, _SkyTextExpandComponent__text, _SkyTextExpandComponent__textEl, _SkyTextExpandComponent_resources, _SkyTextExpandComponent_modalSvc, _SkyTextExpandComponent_textExpandAdapter, _SkyTextExpandComponent_setup, _SkyTextExpandComponent_getNewlineCount, _SkyTextExpandComponent_getTruncatedText, _SkyTextExpandComponent_animateText;
2322
- /**
2323
- * Auto-incrementing integer used to generate unique ids for text expand components.
2324
- */
2325
- let nextId$1 = 0;
2326
- class SkyTextExpandComponent {
2327
- /**
2328
- * The maximum number of text characters to display inline when users select the link
2329
- * to expand the full text. If the text exceeds this limit, then the component expands
2330
- * the full text in a modal instead.
2331
- * @default 600
2332
- */
2333
- set maxExpandedLength(value) {
2334
- if (value) {
2335
- __classPrivateFieldSet(this, _SkyTextExpandComponent__maxExpandedLength, value, "f");
2336
- }
2337
- else {
2338
- __classPrivateFieldSet(this, _SkyTextExpandComponent__maxExpandedLength, 600, "f");
2339
- }
2340
- __classPrivateFieldGet(this, _SkyTextExpandComponent_instances, "m", _SkyTextExpandComponent_setup).call(this, this.text);
2341
- }
2342
- get maxExpandedLength() {
2343
- return __classPrivateFieldGet(this, _SkyTextExpandComponent__maxExpandedLength, "f");
2344
- }
2345
- /**
2346
- * The maximum number of newline characters to display inline when users select
2347
- * the link to expand the full text. If the text exceeds this limit, then
2348
- * the component expands the full text in a modal view instead.
2349
- * @default 2
2350
- */
2351
- set maxExpandedNewlines(value) {
2352
- if (value) {
2353
- __classPrivateFieldSet(this, _SkyTextExpandComponent__maxExpandedNewlines, value, "f");
2354
- }
2355
- else {
2356
- __classPrivateFieldSet(this, _SkyTextExpandComponent__maxExpandedNewlines, 2, "f");
2357
- }
2358
- __classPrivateFieldGet(this, _SkyTextExpandComponent_instances, "m", _SkyTextExpandComponent_setup).call(this, this.text);
2359
- }
2360
- get maxExpandedNewlines() {
2361
- return __classPrivateFieldGet(this, _SkyTextExpandComponent__maxExpandedNewlines, "f");
2362
- }
2363
- /**
2364
- * The number of text characters to display before truncating the text.
2365
- * To avoid truncating text in the middle of a word, the component looks for a space
2366
- * in the 10 characters before the last character.
2367
- * @default 200
2368
- */
2369
- set maxLength(value) {
2370
- if (value) {
2371
- __classPrivateFieldSet(this, _SkyTextExpandComponent__maxLength, value, "f");
2372
- }
2373
- else {
2374
- __classPrivateFieldSet(this, _SkyTextExpandComponent__maxLength, 200, "f");
2375
- }
2376
- __classPrivateFieldGet(this, _SkyTextExpandComponent_instances, "m", _SkyTextExpandComponent_setup).call(this, this.text);
2377
- }
2378
- get maxLength() {
2379
- return __classPrivateFieldGet(this, _SkyTextExpandComponent__maxLength, "f");
2380
- }
2381
- /**
2382
- * The text to truncate.
2383
- */
2384
- set text(value) {
2385
- __classPrivateFieldSet(this, _SkyTextExpandComponent__text, value ?? '', "f");
2386
- __classPrivateFieldGet(this, _SkyTextExpandComponent_instances, "m", _SkyTextExpandComponent_setup).call(this, __classPrivateFieldGet(this, _SkyTextExpandComponent__text, "f"));
2387
- }
2388
- get text() {
2389
- return __classPrivateFieldGet(this, _SkyTextExpandComponent__text, "f");
2390
- }
2391
- set textEl(value) {
2392
- __classPrivateFieldSet(this, _SkyTextExpandComponent__textEl, value, "f");
2393
- __classPrivateFieldGet(this, _SkyTextExpandComponent_instances, "m", _SkyTextExpandComponent_setup).call(this, this.text);
2394
- }
2395
- get textEl() {
2396
- return __classPrivateFieldGet(this, _SkyTextExpandComponent__textEl, "f");
2397
- }
2398
- constructor(resources, modalSvc, textExpandAdapter) {
2399
- _SkyTextExpandComponent_instances.add(this);
2400
- /**
2401
- * Whether to replace newline characters in truncated text with spaces.
2402
- */
2403
- this.truncateNewlines = true;
2404
- this.buttonText = '';
2405
- this.contentSectionId = `sky-text-expand-content-${++nextId$1}`;
2406
- this.expandable = false;
2407
- this.isModal = false;
2408
- this.transitionHeight = 1;
2409
- _SkyTextExpandComponent_collapsedText.set(this, '');
2410
- _SkyTextExpandComponent_newlineCount.set(this, 0);
2411
- _SkyTextExpandComponent_seeMoreText.set(this, '');
2412
- _SkyTextExpandComponent_seeLessText.set(this, '');
2413
- _SkyTextExpandComponent_textToShow.set(this, '');
2414
- _SkyTextExpandComponent__maxExpandedLength.set(this, 600);
2415
- _SkyTextExpandComponent__maxExpandedNewlines.set(this, 2);
2416
- _SkyTextExpandComponent__maxLength.set(this, 200);
2417
- _SkyTextExpandComponent__text.set(this, '');
2418
- _SkyTextExpandComponent__textEl.set(this, void 0);
2419
- _SkyTextExpandComponent_resources.set(this, void 0);
2420
- _SkyTextExpandComponent_modalSvc.set(this, void 0);
2421
- _SkyTextExpandComponent_textExpandAdapter.set(this, void 0);
2422
- __classPrivateFieldSet(this, _SkyTextExpandComponent_resources, resources, "f");
2423
- __classPrivateFieldSet(this, _SkyTextExpandComponent_modalSvc, modalSvc, "f");
2424
- __classPrivateFieldSet(this, _SkyTextExpandComponent_textExpandAdapter, textExpandAdapter, "f");
2425
- }
2426
- textExpand() {
2427
- if (this.isModal) {
2428
- // Modal View
2429
- /* istanbul ignore else */
2430
- /* sanity check */
2431
- if (!this.isExpanded) {
2432
- __classPrivateFieldGet(this, _SkyTextExpandComponent_modalSvc, "f").open(SkyTextExpandModalComponent, [
2433
- {
2434
- provide: SKY_TEXT_EXPAND_MODAL_CONTEXT,
2435
- useValue: {
2436
- header: this.expandModalTitle,
2437
- text: this.text,
2438
- },
2439
- },
2440
- ]);
2441
- }
2442
- }
2443
- else {
2444
- // Normal View
2445
- if (!this.isExpanded) {
2446
- __classPrivateFieldGet(this, _SkyTextExpandComponent_instances, "m", _SkyTextExpandComponent_animateText).call(this, true);
2447
- }
2448
- else {
2449
- __classPrivateFieldGet(this, _SkyTextExpandComponent_instances, "m", _SkyTextExpandComponent_animateText).call(this, false);
2450
- }
2451
- }
2452
- }
2453
- animationEnd() {
2454
- if (this.textEl && this.containerEl) {
2455
- // Ensure the correct text is displayed
2456
- __classPrivateFieldGet(this, _SkyTextExpandComponent_textExpandAdapter, "f").setText(this.textEl, __classPrivateFieldGet(this, _SkyTextExpandComponent_textToShow, "f"));
2457
- setTimeout(() => {
2458
- if (this.containerEl) {
2459
- // Set height back to auto so the browser can change the height as needed with window changes
2460
- __classPrivateFieldGet(this, _SkyTextExpandComponent_textExpandAdapter, "f").removeContainerMaxHeight(this.containerEl);
2461
- }
2462
- });
2463
- }
2464
- }
2465
- ngAfterContentInit() {
2466
- forkJoin([
2467
- __classPrivateFieldGet(this, _SkyTextExpandComponent_resources, "f").getString('skyux_text_expand_see_more'),
2468
- __classPrivateFieldGet(this, _SkyTextExpandComponent_resources, "f").getString('skyux_text_expand_see_less'),
2469
- ])
2470
- .pipe(take(1))
2471
- .subscribe((resources) => {
2472
- __classPrivateFieldSet(this, _SkyTextExpandComponent_seeMoreText, resources[0], "f");
2473
- __classPrivateFieldSet(this, _SkyTextExpandComponent_seeLessText, resources[1], "f");
2474
- __classPrivateFieldGet(this, _SkyTextExpandComponent_instances, "m", _SkyTextExpandComponent_setup).call(this, this.text);
2475
- /* istanbul ignore else */
2476
- if (!this.expandModalTitle) {
2477
- __classPrivateFieldGet(this, _SkyTextExpandComponent_resources, "f")
2478
- .getString('skyux_text_expand_modal_title')
2479
- .pipe(take(1))
2480
- .subscribe((resource) => {
2481
- this.expandModalTitle = resource;
2482
- });
2483
- }
2484
- });
2485
- }
2486
- }
2487
- _SkyTextExpandComponent_collapsedText = new WeakMap(), _SkyTextExpandComponent_newlineCount = new WeakMap(), _SkyTextExpandComponent_seeMoreText = new WeakMap(), _SkyTextExpandComponent_seeLessText = new WeakMap(), _SkyTextExpandComponent_textToShow = new WeakMap(), _SkyTextExpandComponent__maxExpandedLength = new WeakMap(), _SkyTextExpandComponent__maxExpandedNewlines = new WeakMap(), _SkyTextExpandComponent__maxLength = new WeakMap(), _SkyTextExpandComponent__text = new WeakMap(), _SkyTextExpandComponent__textEl = new WeakMap(), _SkyTextExpandComponent_resources = new WeakMap(), _SkyTextExpandComponent_modalSvc = new WeakMap(), _SkyTextExpandComponent_textExpandAdapter = new WeakMap(), _SkyTextExpandComponent_instances = new WeakSet(), _SkyTextExpandComponent_setup = function _SkyTextExpandComponent_setup(value) {
2488
- if (value) {
2489
- __classPrivateFieldSet(this, _SkyTextExpandComponent_newlineCount, __classPrivateFieldGet(this, _SkyTextExpandComponent_instances, "m", _SkyTextExpandComponent_getNewlineCount).call(this, value), "f");
2490
- __classPrivateFieldSet(this, _SkyTextExpandComponent_collapsedText, __classPrivateFieldGet(this, _SkyTextExpandComponent_instances, "m", _SkyTextExpandComponent_getTruncatedText).call(this, value, this.maxLength), "f");
2491
- if (__classPrivateFieldGet(this, _SkyTextExpandComponent_collapsedText, "f") !== value) {
2492
- this.buttonText = __classPrivateFieldGet(this, _SkyTextExpandComponent_seeMoreText, "f");
2493
- this.isExpanded = false;
2494
- this.expandable = true;
2495
- this.isModal =
2496
- __classPrivateFieldGet(this, _SkyTextExpandComponent_newlineCount, "f") > this.maxExpandedNewlines ||
2497
- this.text.length > this.maxExpandedLength;
2498
- }
2499
- else {
2500
- this.expandable = false;
2501
- }
2502
- __classPrivateFieldSet(this, _SkyTextExpandComponent_textToShow, __classPrivateFieldGet(this, _SkyTextExpandComponent_collapsedText, "f"), "f");
2503
- }
2504
- else {
2505
- __classPrivateFieldSet(this, _SkyTextExpandComponent_textToShow, '', "f");
2506
- this.expandable = false;
2507
- }
2508
- if (this.textEl) {
2509
- __classPrivateFieldGet(this, _SkyTextExpandComponent_textExpandAdapter, "f").setText(this.textEl, __classPrivateFieldGet(this, _SkyTextExpandComponent_textToShow, "f"));
2510
- }
2511
- }, _SkyTextExpandComponent_getNewlineCount = function _SkyTextExpandComponent_getNewlineCount(value) {
2512
- const matches = value.match(/\n/gi);
2513
- if (matches) {
2514
- return matches.length;
2515
- }
2516
- return 0;
2517
- }, _SkyTextExpandComponent_getTruncatedText = function _SkyTextExpandComponent_getTruncatedText(value, length) {
2518
- let i;
2519
- if (this.truncateNewlines) {
2520
- value = value.replace(/\n+/gi, ' ');
2521
- }
2522
- // Jump ahead one character and see if it's a space, and if it isn't,
2523
- // back up to the first space and break there so a word doesn't get cut
2524
- // in half.
2525
- if (length < value.length) {
2526
- for (i = length; i > length - 10; i--) {
2527
- if (/\s/.test(value.charAt(i))) {
2528
- length = i;
2529
- break;
2530
- }
2531
- }
2532
- }
2533
- return value.substring(0, length);
2534
- }, _SkyTextExpandComponent_animateText = function _SkyTextExpandComponent_animateText(expanding) {
2535
- if (this.containerEl && this.textEl) {
2536
- const adapter = __classPrivateFieldGet(this, _SkyTextExpandComponent_textExpandAdapter, "f");
2537
- const container = this.containerEl;
2538
- if (expanding) {
2539
- adapter.setText(this.textEl, this.text);
2540
- __classPrivateFieldSet(this, _SkyTextExpandComponent_textToShow, this.text, "f");
2541
- }
2542
- else {
2543
- adapter.setText(this.textEl, __classPrivateFieldGet(this, _SkyTextExpandComponent_collapsedText, "f"));
2544
- __classPrivateFieldSet(this, _SkyTextExpandComponent_textToShow, __classPrivateFieldGet(this, _SkyTextExpandComponent_collapsedText, "f"), "f");
2545
- }
2546
- this.buttonText = expanding ? __classPrivateFieldGet(this, _SkyTextExpandComponent_seeLessText, "f") : __classPrivateFieldGet(this, _SkyTextExpandComponent_seeMoreText, "f");
2547
- // Measure the new height so we can animate to it.
2548
- const newHeight = adapter.getContainerHeight(container);
2549
- this.transitionHeight = newHeight;
2550
- // Always show all text while animating so that the animation is smooth. The animation callback will set this back if needed.
2551
- if (!expanding) {
2552
- adapter.setText(this.textEl, this.text);
2553
- }
2554
- this.isExpanded = expanding;
2555
- }
2556
- };
2557
- SkyTextExpandComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandComponent, deps: [{ token: i1$3.SkyLibResourcesService }, { token: i1$4.SkyModalService }, { token: SkyTextExpandAdapterService }], target: i0.ɵɵFactoryTarget.Component });
2558
- SkyTextExpandComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyTextExpandComponent, selector: "sky-text-expand", inputs: { expandModalTitle: "expandModalTitle", maxExpandedLength: "maxExpandedLength", maxExpandedNewlines: "maxExpandedNewlines", maxLength: "maxLength", text: "text", truncateNewlines: "truncateNewlines" }, providers: [SkyTextExpandAdapterService], viewQueries: [{ propertyName: "containerEl", first: true, predicate: ["container"], descendants: true, read: ElementRef, static: true }, { propertyName: "textEl", first: true, predicate: ["text"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div\n [@expansionAnimation]=\"{\n value: isExpanded,\n params: { transitionHeight: transitionHeight }\n }\"\n (@expansionAnimation.done)=\"animationEnd()\"\n class=\"sky-text-expand-container\"\n #container\n>\n <span class=\"sky-text-expand-text\" [id]=\"contentSectionId\" #text></span>\n <span class=\"sky-text-expand-ellipsis\" *ngIf=\"!isExpanded && expandable\"\n >...\n </span>\n <button\n *ngIf=\"expandable\"\n type=\"button\"\n class=\"sky-btn sky-btn-link-inline sky-text-expand-see-more\"\n [attr.aria-expanded]=\"isModal ? undefined : !!isExpanded\"\n [attr.aria-controls]=\"isModal ? undefined : contentSectionId\"\n [attr.aria-haspopup]=\"isModal ? 'dialog' : undefined\"\n (click)=\"textExpand()\"\n >\n {{ buttonText }}\n </button>\n</div>\n", styles: [".sky-text-expand-ellipsis{letter-spacing:2px;white-space:nowrap}.sky-text-expand-space{white-space:normal}.sky-text-expand-see-more{white-space:nowrap;margin-left:5px}.sky-text-expand-text{margin:0;white-space:pre-wrap}.sky-text-expand-container{word-break:break-word;word-wrap:break-word;overflow:hidden;height:auto}.sky-text-expand-modal-content{white-space:pre-line;word-wrap:break-word}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [
2559
- trigger('expansionAnimation', [
2560
- transition(':enter', []),
2561
- state('true', style({
2562
- maxHeight: '{{transitionHeight}}px',
2563
- }), { params: { transitionHeight: 0 } }),
2564
- state('false', style({
2565
- maxHeight: '{{transitionHeight}}px',
2566
- }), { params: { transitionHeight: 0 } }),
2567
- transition('true => false', animate('250ms ease')),
2568
- transition('false => true', animate('250ms ease')),
2569
- transition('void => *', []),
2570
- ]),
2571
- ] });
2572
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandComponent, decorators: [{
2573
- type: Component,
2574
- args: [{ animations: [
2575
- trigger('expansionAnimation', [
2576
- transition(':enter', []),
2577
- state('true', style({
2578
- maxHeight: '{{transitionHeight}}px',
2579
- }), { params: { transitionHeight: 0 } }),
2580
- state('false', style({
2581
- maxHeight: '{{transitionHeight}}px',
2582
- }), { params: { transitionHeight: 0 } }),
2583
- transition('true => false', animate('250ms ease')),
2584
- transition('false => true', animate('250ms ease')),
2585
- transition('void => *', []),
2586
- ]),
2587
- ], selector: 'sky-text-expand', providers: [SkyTextExpandAdapterService], template: "<div\n [@expansionAnimation]=\"{\n value: isExpanded,\n params: { transitionHeight: transitionHeight }\n }\"\n (@expansionAnimation.done)=\"animationEnd()\"\n class=\"sky-text-expand-container\"\n #container\n>\n <span class=\"sky-text-expand-text\" [id]=\"contentSectionId\" #text></span>\n <span class=\"sky-text-expand-ellipsis\" *ngIf=\"!isExpanded && expandable\"\n >...\n </span>\n <button\n *ngIf=\"expandable\"\n type=\"button\"\n class=\"sky-btn sky-btn-link-inline sky-text-expand-see-more\"\n [attr.aria-expanded]=\"isModal ? undefined : !!isExpanded\"\n [attr.aria-controls]=\"isModal ? undefined : contentSectionId\"\n [attr.aria-haspopup]=\"isModal ? 'dialog' : undefined\"\n (click)=\"textExpand()\"\n >\n {{ buttonText }}\n </button>\n</div>\n", styles: [".sky-text-expand-ellipsis{letter-spacing:2px;white-space:nowrap}.sky-text-expand-space{white-space:normal}.sky-text-expand-see-more{white-space:nowrap;margin-left:5px}.sky-text-expand-text{margin:0;white-space:pre-wrap}.sky-text-expand-container{word-break:break-word;word-wrap:break-word;overflow:hidden;height:auto}.sky-text-expand-modal-content{white-space:pre-line;word-wrap:break-word}\n"] }]
2588
- }], ctorParameters: function () { return [{ type: i1$3.SkyLibResourcesService }, { type: i1$4.SkyModalService }, { type: SkyTextExpandAdapterService }]; }, propDecorators: { expandModalTitle: [{
2589
- type: Input
2590
- }], maxExpandedLength: [{
2591
- type: Input
2592
- }], maxExpandedNewlines: [{
2593
- type: Input
2594
- }], maxLength: [{
2595
- type: Input
2596
- }], text: [{
2597
- type: Input
2598
- }], truncateNewlines: [{
2599
- type: Input
2600
- }], containerEl: [{
2601
- type: ViewChild,
2602
- args: ['container', {
2603
- read: ElementRef,
2604
- static: true,
2605
- }]
2606
- }], textEl: [{
2607
- type: ViewChild,
2608
- args: ['text', {
2609
- read: ElementRef,
2610
- static: true,
2611
- }]
2612
- }] } });
2613
-
2614
- class SkyTextExpandModule {
2615
- }
2616
- SkyTextExpandModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2617
- SkyTextExpandModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandModule, declarations: [SkyTextExpandComponent, SkyTextExpandModalComponent], imports: [SkyI18nModule,
2618
- SkyLayoutResourcesModule,
2619
- SkyModalModule,
2620
- CommonModule], exports: [SkyTextExpandComponent] });
2621
- SkyTextExpandModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandModule, imports: [SkyI18nModule,
2622
- SkyLayoutResourcesModule,
2623
- SkyModalModule,
2624
- CommonModule] });
2625
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandModule, decorators: [{
2626
- type: NgModule,
2627
- args: [{
2628
- declarations: [SkyTextExpandComponent, SkyTextExpandModalComponent],
2629
- imports: [
2630
- SkyI18nModule,
2631
- SkyLayoutResourcesModule,
2632
- SkyModalModule,
2633
- CommonModule,
2634
- ],
2635
- exports: [SkyTextExpandComponent],
2636
- }]
2637
- }] });
2638
-
2639
- var _SkyTextExpandRepeaterAdapterService_renderer;
2640
- /**
2641
- * @internal
2642
- */
2643
- class SkyTextExpandRepeaterAdapterService {
2644
- constructor(rendererFactory) {
2645
- _SkyTextExpandRepeaterAdapterService_renderer.set(this, void 0);
2646
- __classPrivateFieldSet(this, _SkyTextExpandRepeaterAdapterService_renderer, rendererFactory.createRenderer(undefined, null), "f");
2647
- }
2648
- getItems(elRef) {
2649
- return elRef.nativeElement.querySelectorAll('.sky-text-expand-repeater-item');
2650
- }
2651
- hideItem(item) {
2652
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterAdapterService_renderer, "f").setStyle(item, 'display', 'none');
2653
- }
2654
- showItem(item) {
2655
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterAdapterService_renderer, "f").removeStyle(item, 'display');
2656
- }
2657
- getContainerHeight(containerEl) {
2658
- return containerEl.nativeElement.offsetHeight;
2659
- }
2660
- removeContainerMaxHeight(containerEl) {
2661
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterAdapterService_renderer, "f").removeStyle(containerEl.nativeElement, 'max-height');
2662
- }
2663
- }
2664
- _SkyTextExpandRepeaterAdapterService_renderer = new WeakMap();
2665
- SkyTextExpandRepeaterAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandRepeaterAdapterService, deps: [{ token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
2666
- SkyTextExpandRepeaterAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandRepeaterAdapterService });
2667
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandRepeaterAdapterService, decorators: [{
2668
- type: Injectable
2669
- }], ctorParameters: function () { return [{ type: i0.RendererFactory2 }]; } });
2670
-
2671
- var _SkyTextExpandRepeaterComponent_instances, _SkyTextExpandRepeaterComponent_seeMoreText, _SkyTextExpandRepeaterComponent_seeLessText, _SkyTextExpandRepeaterComponent_htmlItems, _SkyTextExpandRepeaterComponent__data, _SkyTextExpandRepeaterComponent__maxItems, _SkyTextExpandRepeaterComponent_resources, _SkyTextExpandRepeaterComponent_elRef, _SkyTextExpandRepeaterComponent_textExpandRepeaterAdapter, _SkyTextExpandRepeaterComponent_changeDetector, _SkyTextExpandRepeaterComponent_animateRepeater, _SkyTextExpandRepeaterComponent_setup, _SkyTextExpandRepeaterComponent_hideItems, _SkyTextExpandRepeaterComponent_showItems;
2672
- /**
2673
- * Auto-incrementing integer used to generate unique ids for text expand repeater components.
2674
- */
2675
- let nextId = 0;
2676
- class SkyTextExpandRepeaterComponent {
2677
- /**
2678
- * The data to truncate.
2679
- */
2680
- set data(value) {
2681
- __classPrivateFieldSet(this, _SkyTextExpandRepeaterComponent__data, value, "f");
2682
- // Wait for the dom to render the new items based on the updated data
2683
- setTimeout(() => {
2684
- __classPrivateFieldSet(this, _SkyTextExpandRepeaterComponent_htmlItems, __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_textExpandRepeaterAdapter, "f").getItems(__classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_elRef, "f")), "f");
2685
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_instances, "m", _SkyTextExpandRepeaterComponent_setup).call(this, value);
2686
- });
2687
- }
2688
- get data() {
2689
- return __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent__data, "f");
2690
- }
2691
- /**
2692
- * The number of items to display before truncating the list. If not supplied, all items are shown.
2693
- */
2694
- set maxItems(value) {
2695
- __classPrivateFieldSet(this, _SkyTextExpandRepeaterComponent__maxItems, value, "f");
2696
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_instances, "m", _SkyTextExpandRepeaterComponent_setup).call(this, this.data);
2697
- }
2698
- get maxItems() {
2699
- return __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent__maxItems, "f");
2700
- }
2701
- constructor(resources, elRef, textExpandRepeaterAdapter, changeDetector) {
2702
- _SkyTextExpandRepeaterComponent_instances.add(this);
2703
- /**
2704
- * The style of bullet to use
2705
- * @default "unordered"
2706
- */
2707
- this.listStyle = 'unordered';
2708
- this.buttonText = '';
2709
- this.expandable = false;
2710
- this.contentSectionId = `sky-text-expand-repeater-content-${++nextId}`;
2711
- this.transitionHeight = 1;
2712
- _SkyTextExpandRepeaterComponent_seeMoreText.set(this, '');
2713
- _SkyTextExpandRepeaterComponent_seeLessText.set(this, '');
2714
- _SkyTextExpandRepeaterComponent_htmlItems.set(this, void 0);
2715
- _SkyTextExpandRepeaterComponent__data.set(this, void 0);
2716
- _SkyTextExpandRepeaterComponent__maxItems.set(this, void 0);
2717
- _SkyTextExpandRepeaterComponent_resources.set(this, void 0);
2718
- _SkyTextExpandRepeaterComponent_elRef.set(this, void 0);
2719
- _SkyTextExpandRepeaterComponent_textExpandRepeaterAdapter.set(this, void 0);
2720
- _SkyTextExpandRepeaterComponent_changeDetector.set(this, void 0);
2721
- __classPrivateFieldSet(this, _SkyTextExpandRepeaterComponent_resources, resources, "f");
2722
- __classPrivateFieldSet(this, _SkyTextExpandRepeaterComponent_elRef, elRef, "f");
2723
- __classPrivateFieldSet(this, _SkyTextExpandRepeaterComponent_textExpandRepeaterAdapter, textExpandRepeaterAdapter, "f");
2724
- __classPrivateFieldSet(this, _SkyTextExpandRepeaterComponent_changeDetector, changeDetector, "f");
2725
- }
2726
- ngAfterViewInit() {
2727
- forkJoin([
2728
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_resources, "f").getString('skyux_text_expand_see_more'),
2729
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_resources, "f").getString('skyux_text_expand_see_less'),
2730
- ])
2731
- .pipe(take(1))
2732
- .subscribe((resources) => {
2733
- __classPrivateFieldSet(this, _SkyTextExpandRepeaterComponent_seeMoreText, resources[0], "f");
2734
- __classPrivateFieldSet(this, _SkyTextExpandRepeaterComponent_seeLessText, resources[1], "f");
2735
- /* sanity check */
2736
- /* istanbul ignore else */
2737
- if (!this.isExpanded) {
2738
- this.buttonText = __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_seeMoreText, "f");
2739
- }
2740
- else {
2741
- this.buttonText = __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_seeLessText, "f");
2742
- }
2743
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_changeDetector, "f").detectChanges();
2744
- });
2745
- }
2746
- animationEnd() {
2747
- // Ensure all items that should be hidden are hidden. This is because we need them shown during the animation window for visual purposes.
2748
- if (!this.isExpanded) {
2749
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_instances, "m", _SkyTextExpandRepeaterComponent_hideItems).call(this);
2750
- }
2751
- // This set timeout is needed as the `animationEnd` function is called by the angular animation callback prior to the animation setting the style on the element
2752
- setTimeout(() => {
2753
- if (this.containerEl) {
2754
- // Set height back to auto so the browser can change the height as needed with window changes
2755
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_textExpandRepeaterAdapter, "f").removeContainerMaxHeight(this.containerEl);
2756
- }
2757
- });
2758
- }
2759
- repeaterExpand() {
2760
- if (!this.isExpanded) {
2761
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_instances, "m", _SkyTextExpandRepeaterComponent_animateRepeater).call(this, true);
2762
- }
2763
- else {
2764
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_instances, "m", _SkyTextExpandRepeaterComponent_animateRepeater).call(this, false);
2765
- }
2766
- }
2767
- }
2768
- _SkyTextExpandRepeaterComponent_seeMoreText = new WeakMap(), _SkyTextExpandRepeaterComponent_seeLessText = new WeakMap(), _SkyTextExpandRepeaterComponent_htmlItems = new WeakMap(), _SkyTextExpandRepeaterComponent__data = new WeakMap(), _SkyTextExpandRepeaterComponent__maxItems = new WeakMap(), _SkyTextExpandRepeaterComponent_resources = new WeakMap(), _SkyTextExpandRepeaterComponent_elRef = new WeakMap(), _SkyTextExpandRepeaterComponent_textExpandRepeaterAdapter = new WeakMap(), _SkyTextExpandRepeaterComponent_changeDetector = new WeakMap(), _SkyTextExpandRepeaterComponent_instances = new WeakSet(), _SkyTextExpandRepeaterComponent_animateRepeater = function _SkyTextExpandRepeaterComponent_animateRepeater(expanding) {
2769
- const adapter = __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_textExpandRepeaterAdapter, "f");
2770
- const container = this.containerEl;
2771
- if (container) {
2772
- if (expanding) {
2773
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_instances, "m", _SkyTextExpandRepeaterComponent_showItems).call(this);
2774
- }
2775
- else {
2776
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_instances, "m", _SkyTextExpandRepeaterComponent_hideItems).call(this);
2777
- }
2778
- const newHeight = adapter.getContainerHeight(container);
2779
- this.transitionHeight = newHeight;
2780
- if (!expanding) {
2781
- this.buttonText = __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_seeMoreText, "f");
2782
- }
2783
- else {
2784
- this.buttonText = __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_seeLessText, "f");
2785
- }
2786
- if (!expanding) {
2787
- // Show all items during animation for visual purposes.
2788
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_instances, "m", _SkyTextExpandRepeaterComponent_showItems).call(this);
2789
- }
2790
- this.isExpanded = expanding;
2791
- }
2792
- }, _SkyTextExpandRepeaterComponent_setup = function _SkyTextExpandRepeaterComponent_setup(value) {
2793
- if (value) {
2794
- const length = value.length;
2795
- if (this.maxItems && length > this.maxItems) {
2796
- this.expandable = true;
2797
- this.buttonText = __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_seeMoreText, "f");
2798
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_instances, "m", _SkyTextExpandRepeaterComponent_hideItems).call(this);
2799
- if (this.containerEl) {
2800
- this.transitionHeight =
2801
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_textExpandRepeaterAdapter, "f").getContainerHeight(this.containerEl);
2802
- }
2803
- this.isExpanded = false;
2804
- }
2805
- else {
2806
- this.expandable = false;
2807
- this.isExpanded = undefined;
2808
- }
2809
- }
2810
- else {
2811
- this.expandable = false;
2812
- this.isExpanded = undefined;
2813
- }
2814
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_changeDetector, "f").markForCheck();
2815
- }, _SkyTextExpandRepeaterComponent_hideItems = function _SkyTextExpandRepeaterComponent_hideItems() {
2816
- if (__classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_htmlItems, "f") && this.maxItems) {
2817
- for (let i = this.maxItems; i < __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_htmlItems, "f").length; i++) {
2818
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_textExpandRepeaterAdapter, "f").hideItem(__classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_htmlItems, "f")[i]);
2819
- }
2820
- }
2821
- }, _SkyTextExpandRepeaterComponent_showItems = function _SkyTextExpandRepeaterComponent_showItems() {
2822
- if (__classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_htmlItems, "f") && this.maxItems) {
2823
- for (let i = this.maxItems; i < __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_htmlItems, "f").length; i++) {
2824
- __classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_textExpandRepeaterAdapter, "f").showItem(__classPrivateFieldGet(this, _SkyTextExpandRepeaterComponent_htmlItems, "f")[i]);
2825
- }
2826
- }
2827
- };
2828
- SkyTextExpandRepeaterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandRepeaterComponent, deps: [{ token: i1$3.SkyLibResourcesService }, { token: i0.ElementRef }, { token: SkyTextExpandRepeaterAdapterService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
2829
- SkyTextExpandRepeaterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyTextExpandRepeaterComponent, selector: "sky-text-expand-repeater", inputs: { data: "data", itemTemplate: "itemTemplate", listStyle: "listStyle", maxItems: "maxItems" }, providers: [SkyTextExpandRepeaterAdapterService], viewQueries: [{ propertyName: "containerEl", first: true, predicate: ["container"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"sky-text-expand-repeater\">\n <ul\n *ngIf=\"listStyle !== 'ordered'\"\n class=\"sky-text-expand-repeater-container\"\n [@expansionAnimation]=\"{\n value: isExpanded,\n params: { transitionHeight: transitionHeight }\n }\"\n (@expansionAnimation.done)=\"animationEnd()\"\n [id]=\"contentSectionId\"\n [ngClass]=\"{\n 'sky-text-expand-repeater-list-style-none': listStyle === 'unstyled'\n }\"\n #container\n >\n <ng-template [ngTemplateOutlet]=\"listItemTemplate\"></ng-template>\n </ul>\n <ol\n *ngIf=\"listStyle === 'ordered'\"\n class=\"sky-text-expand-repeater-container\"\n [@expansionAnimation]=\"{\n value: isExpanded,\n params: { transitionHeight: transitionHeight }\n }\"\n (@expansionAnimation.done)=\"animationEnd()\"\n [id]=\"contentSectionId\"\n #container\n >\n <ng-template [ngTemplateOutlet]=\"listItemTemplate\"></ng-template>\n </ol>\n <button\n *ngIf=\"expandable\"\n type=\"button\"\n class=\"sky-btn sky-btn-link-inline sky-text-expand-repeater-see-more\"\n [attr.aria-expanded]=\"!!isExpanded\"\n [attr.aria-controls]=\"contentSectionId\"\n (click)=\"repeaterExpand()\"\n [ngClass]=\"{\n 'sky-text-expand-repeater-see-more-list-style-none':\n listStyle === 'unstyled'\n }\"\n >\n {{ buttonText }}\n </button>\n</div>\n\n<ng-template let-item #defaultItemTemplate>\n {{ item }}\n</ng-template>\n\n<ng-template #listItemTemplate>\n <li *ngFor=\"let item of data\" class=\"sky-text-expand-repeater-item\">\n <ng-template\n [ngTemplateOutlet]=\"itemTemplate || defaultItemTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n </li>\n</ng-template>\n", styles: [":host{display:block}.sky-text-expand-repeater-container{overflow-y:hidden;height:auto;margin-bottom:0;margin-top:var(--sky-compat-text-expand-repeater-margin-top, 0)}.sky-text-expand-repeater-see-more{white-space:nowrap;margin-left:40px}.sky-text-expand-repeater-list-style-none{list-style-type:none;padding-left:0}.sky-text-expand-repeater-see-more-list-style-none{margin-left:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
2830
- trigger('expansionAnimation', [
2831
- transition(':enter', []),
2832
- state('true', style({
2833
- maxHeight: '{{transitionHeight}}px',
2834
- }), { params: { transitionHeight: 0 } }),
2835
- state('false', style({
2836
- maxHeight: '{{transitionHeight}}px',
2837
- }), { params: { transitionHeight: 0 } }),
2838
- transition('true => false', animate('250ms ease')),
2839
- transition('false => true', animate('250ms ease')),
2840
- transition('void => *', []),
2841
- ]),
2842
- ] });
2843
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandRepeaterComponent, decorators: [{
2844
- type: Component,
2845
- args: [{ animations: [
2846
- trigger('expansionAnimation', [
2847
- transition(':enter', []),
2848
- state('true', style({
2849
- maxHeight: '{{transitionHeight}}px',
2850
- }), { params: { transitionHeight: 0 } }),
2851
- state('false', style({
2852
- maxHeight: '{{transitionHeight}}px',
2853
- }), { params: { transitionHeight: 0 } }),
2854
- transition('true => false', animate('250ms ease')),
2855
- transition('false => true', animate('250ms ease')),
2856
- transition('void => *', []),
2857
- ]),
2858
- ], selector: 'sky-text-expand-repeater', providers: [SkyTextExpandRepeaterAdapterService], template: "<div class=\"sky-text-expand-repeater\">\n <ul\n *ngIf=\"listStyle !== 'ordered'\"\n class=\"sky-text-expand-repeater-container\"\n [@expansionAnimation]=\"{\n value: isExpanded,\n params: { transitionHeight: transitionHeight }\n }\"\n (@expansionAnimation.done)=\"animationEnd()\"\n [id]=\"contentSectionId\"\n [ngClass]=\"{\n 'sky-text-expand-repeater-list-style-none': listStyle === 'unstyled'\n }\"\n #container\n >\n <ng-template [ngTemplateOutlet]=\"listItemTemplate\"></ng-template>\n </ul>\n <ol\n *ngIf=\"listStyle === 'ordered'\"\n class=\"sky-text-expand-repeater-container\"\n [@expansionAnimation]=\"{\n value: isExpanded,\n params: { transitionHeight: transitionHeight }\n }\"\n (@expansionAnimation.done)=\"animationEnd()\"\n [id]=\"contentSectionId\"\n #container\n >\n <ng-template [ngTemplateOutlet]=\"listItemTemplate\"></ng-template>\n </ol>\n <button\n *ngIf=\"expandable\"\n type=\"button\"\n class=\"sky-btn sky-btn-link-inline sky-text-expand-repeater-see-more\"\n [attr.aria-expanded]=\"!!isExpanded\"\n [attr.aria-controls]=\"contentSectionId\"\n (click)=\"repeaterExpand()\"\n [ngClass]=\"{\n 'sky-text-expand-repeater-see-more-list-style-none':\n listStyle === 'unstyled'\n }\"\n >\n {{ buttonText }}\n </button>\n</div>\n\n<ng-template let-item #defaultItemTemplate>\n {{ item }}\n</ng-template>\n\n<ng-template #listItemTemplate>\n <li *ngFor=\"let item of data\" class=\"sky-text-expand-repeater-item\">\n <ng-template\n [ngTemplateOutlet]=\"itemTemplate || defaultItemTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-template>\n </li>\n</ng-template>\n", styles: [":host{display:block}.sky-text-expand-repeater-container{overflow-y:hidden;height:auto;margin-bottom:0;margin-top:var(--sky-compat-text-expand-repeater-margin-top, 0)}.sky-text-expand-repeater-see-more{white-space:nowrap;margin-left:40px}.sky-text-expand-repeater-list-style-none{list-style-type:none;padding-left:0}.sky-text-expand-repeater-see-more-list-style-none{margin-left:0}\n"] }]
2859
- }], ctorParameters: function () { return [{ type: i1$3.SkyLibResourcesService }, { type: i0.ElementRef }, { type: SkyTextExpandRepeaterAdapterService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { data: [{
2860
- type: Input
2861
- }], itemTemplate: [{
2862
- type: Input
2863
- }], listStyle: [{
2864
- type: Input
2865
- }], maxItems: [{
2866
- type: Input
2867
- }], containerEl: [{
2868
- type: ViewChild,
2869
- args: ['container', {
2870
- read: ElementRef,
2871
- static: false,
2872
- }]
2873
- }] } });
2874
-
2875
- class SkyTextExpandRepeaterModule {
2876
- }
2877
- SkyTextExpandRepeaterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandRepeaterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2878
- SkyTextExpandRepeaterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandRepeaterModule, declarations: [SkyTextExpandRepeaterComponent], imports: [SkyI18nModule, SkyLayoutResourcesModule, CommonModule], exports: [SkyTextExpandRepeaterComponent] });
2879
- SkyTextExpandRepeaterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandRepeaterModule, imports: [SkyI18nModule, SkyLayoutResourcesModule, CommonModule] });
2880
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyTextExpandRepeaterModule, decorators: [{
2881
- type: NgModule,
2882
- args: [{
2883
- declarations: [SkyTextExpandRepeaterComponent],
2884
- imports: [SkyI18nModule, SkyLayoutResourcesModule, CommonModule],
2885
- exports: [SkyTextExpandRepeaterComponent],
2886
- }]
2887
- }] });
2888
-
2889
- /**
2890
- * Specifies a container for an item in the toolbar.
2891
- */
2892
- class SkyToolbarItemComponent {
2893
- }
2894
- SkyToolbarItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyToolbarItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2895
- SkyToolbarItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyToolbarItemComponent, selector: "sky-toolbar-item", ngImport: i0, template: "<div class=\"sky-toolbar-item\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-toolbar-item{margin-right:5px;margin-bottom:5px}:host-context(.sky-theme-modern) .sky-toolbar-item{margin-bottom:0;margin-right:10px}:host-context(.sky-theme-modern) .sky-toolbar-item ::ng-deep .sky-btn{padding-left:10px;padding-right:10px}:host-context(.sky-theme-modern) .sky-toolbar-item ::ng-deep .sky-btn.sky-btn-default:not(:disabled){background-color:transparent;border:none}:host-context(.sky-theme-modern) .sky-toolbar-item ::ng-deep .sky-btn.sky-btn-default:not(:disabled):not(:hover):not(:active):not(:focus){box-shadow:inset 0 0 0 1px transparent}.sky-theme-modern .sky-toolbar-item{margin-bottom:0;margin-right:10px}.sky-theme-modern .sky-toolbar-item ::ng-deep .sky-btn{padding-left:10px;padding-right:10px}.sky-theme-modern .sky-toolbar-item ::ng-deep .sky-btn.sky-btn-default:not(:disabled){background-color:transparent;border:none}.sky-theme-modern .sky-toolbar-item ::ng-deep .sky-btn.sky-btn-default:not(:disabled):not(:hover):not(:active):not(:focus){box-shadow:inset 0 0 0 1px transparent}\n"] });
2896
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyToolbarItemComponent, decorators: [{
2897
- type: Component,
2898
- args: [{ selector: 'sky-toolbar-item', template: "<div class=\"sky-toolbar-item\">\n <ng-content></ng-content>\n</div>\n", styles: [".sky-toolbar-item{margin-right:5px;margin-bottom:5px}:host-context(.sky-theme-modern) .sky-toolbar-item{margin-bottom:0;margin-right:10px}:host-context(.sky-theme-modern) .sky-toolbar-item ::ng-deep .sky-btn{padding-left:10px;padding-right:10px}:host-context(.sky-theme-modern) .sky-toolbar-item ::ng-deep .sky-btn.sky-btn-default:not(:disabled){background-color:transparent;border:none}:host-context(.sky-theme-modern) .sky-toolbar-item ::ng-deep .sky-btn.sky-btn-default:not(:disabled):not(:hover):not(:active):not(:focus){box-shadow:inset 0 0 0 1px transparent}.sky-theme-modern .sky-toolbar-item{margin-bottom:0;margin-right:10px}.sky-theme-modern .sky-toolbar-item ::ng-deep .sky-btn{padding-left:10px;padding-right:10px}.sky-theme-modern .sky-toolbar-item ::ng-deep .sky-btn.sky-btn-default:not(:disabled){background-color:transparent;border:none}.sky-theme-modern .sky-toolbar-item ::ng-deep .sky-btn.sky-btn-default:not(:disabled):not(:hover):not(:active):not(:focus){box-shadow:inset 0 0 0 1px transparent}\n"] }]
2899
- }] });
2900
-
2901
- /**
2902
- * Specifies a section to group items within the toolbar. The section displays items in a separate horizontal row.
2903
- */
2904
- class SkyToolbarSectionComponent {
2905
- }
2906
- SkyToolbarSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyToolbarSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2907
- SkyToolbarSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyToolbarSectionComponent, selector: "sky-toolbar-section", ngImport: i0, template: "<div class=\"sky-toolbar-section\">\n <div class=\"sky-toolbar-section-items\">\n <ng-content></ng-content>\n </div>\n <ng-content select=\"sky-toolbar-view-actions\"></ng-content>\n</div>\n", styles: [".sky-toolbar-section{display:flex;flex-wrap:nowrap;padding:5px 10px 0;min-height:49px;align-items:center;position:relative;overflow-x:auto}.sky-toolbar-section-items{display:flex;flex-wrap:wrap;align-items:center}:host-context(.sky-theme-modern) .sky-toolbar-section{padding:10px 0}.sky-theme-modern .sky-toolbar-section{padding:10px 0}\n"] });
2908
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyToolbarSectionComponent, decorators: [{
2909
- type: Component,
2910
- args: [{ selector: 'sky-toolbar-section', template: "<div class=\"sky-toolbar-section\">\n <div class=\"sky-toolbar-section-items\">\n <ng-content></ng-content>\n </div>\n <ng-content select=\"sky-toolbar-view-actions\"></ng-content>\n</div>\n", styles: [".sky-toolbar-section{display:flex;flex-wrap:nowrap;padding:5px 10px 0;min-height:49px;align-items:center;position:relative;overflow-x:auto}.sky-toolbar-section-items{display:flex;flex-wrap:wrap;align-items:center}:host-context(.sky-theme-modern) .sky-toolbar-section{padding:10px 0}.sky-theme-modern .sky-toolbar-section{padding:10px 0}\n"] }]
2911
- }] });
2912
-
2913
- /**
2914
- * Adds a section on the right side of the toolbar for items that substantially alter
2915
- * the view of the content container. This includes simple filters and view switchers.
2916
- */
2917
- class SkyToolbarViewActionsComponent {
2918
- }
2919
- SkyToolbarViewActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyToolbarViewActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2920
- SkyToolbarViewActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyToolbarViewActionsComponent, selector: "sky-toolbar-view-actions", ngImport: i0, template: "<div class=\"sky-toolbar-view-actions\">\n <ng-content></ng-content>\n</div>\n", styles: [":host{margin-left:auto}.sky-toolbar-view-actions{display:flex;align-items:center;margin-bottom:5px}.sky-toolbar-view-actions ::ng-deep>:not(:last-child){margin-right:5px}:host-context(.sky-theme-modern) .sky-toolbar-view-actions{margin-bottom:0}:host-context(.sky-theme-modern) .sky-toolbar-view-actions ::ng-deep>:not(:last-child){margin-top:5px;margin-bottom:5px;margin-right:10px}:host-context(.sky-theme-modern) .sky-toolbar-view-actions ::ng-deep .sky-btn{background-color:transparent;border:none;padding-left:10px;padding-right:10px}:host-context(.sky-theme-modern) .sky-toolbar-view-actions ::ng-deep .sky-btn:not(:hover):not(:active):not(:focus){box-shadow:inset 0 0 0 1px transparent}.sky-theme-modern .sky-toolbar-view-actions{margin-bottom:0}.sky-theme-modern .sky-toolbar-view-actions ::ng-deep>:not(:last-child){margin-top:5px;margin-bottom:5px;margin-right:10px}.sky-theme-modern .sky-toolbar-view-actions ::ng-deep .sky-btn{background-color:transparent;border:none;padding-left:10px;padding-right:10px}.sky-theme-modern .sky-toolbar-view-actions ::ng-deep .sky-btn:not(:hover):not(:active):not(:focus){box-shadow:inset 0 0 0 1px transparent}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2921
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyToolbarViewActionsComponent, decorators: [{
2922
- type: Component,
2923
- args: [{ selector: 'sky-toolbar-view-actions', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-toolbar-view-actions\">\n <ng-content></ng-content>\n</div>\n", styles: [":host{margin-left:auto}.sky-toolbar-view-actions{display:flex;align-items:center;margin-bottom:5px}.sky-toolbar-view-actions ::ng-deep>:not(:last-child){margin-right:5px}:host-context(.sky-theme-modern) .sky-toolbar-view-actions{margin-bottom:0}:host-context(.sky-theme-modern) .sky-toolbar-view-actions ::ng-deep>:not(:last-child){margin-top:5px;margin-bottom:5px;margin-right:10px}:host-context(.sky-theme-modern) .sky-toolbar-view-actions ::ng-deep .sky-btn{background-color:transparent;border:none;padding-left:10px;padding-right:10px}:host-context(.sky-theme-modern) .sky-toolbar-view-actions ::ng-deep .sky-btn:not(:hover):not(:active):not(:focus){box-shadow:inset 0 0 0 1px transparent}.sky-theme-modern .sky-toolbar-view-actions{margin-bottom:0}.sky-theme-modern .sky-toolbar-view-actions ::ng-deep>:not(:last-child){margin-top:5px;margin-bottom:5px;margin-right:10px}.sky-theme-modern .sky-toolbar-view-actions ::ng-deep .sky-btn{background-color:transparent;border:none;padding-left:10px;padding-right:10px}.sky-theme-modern .sky-toolbar-view-actions ::ng-deep .sky-btn:not(:hover):not(:active):not(:focus){box-shadow:inset 0 0 0 1px transparent}\n"] }]
2924
- }] });
2925
-
2926
- /**
2927
- * Displays actions for lists, records, and tiles.
2928
- */
2929
- class SkyToolbarComponent {
2930
- constructor() {
2931
- this.hasSections = false;
2932
- }
2933
- set sectionComponents(value) {
2934
- this.hasSections = !!value && value.length > 0;
2935
- }
2936
- }
2937
- SkyToolbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2938
- SkyToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SkyToolbarComponent, selector: "sky-toolbar", queries: [{ propertyName: "sectionComponents", predicate: SkyToolbarSectionComponent, descendants: true }], ngImport: i0, template: "<div\n class=\"sky-toolbar-container\"\n [ngClass]=\"{ 'sky-toolbar-sectioned': hasSections }\"\n>\n <ng-content select=\"sky-toolbar-section\"></ng-content>\n <div class=\"sky-toolbar-items\">\n <ng-content></ng-content>\n </div>\n <ng-content select=\"sky-toolbar-view-actions\"></ng-content>\n</div>\n", styles: ["sky-toolbar+:host .sky-toolbar-container{border-top:none}.sky-toolbar-container{min-height:49px;background-color:#fff;padding:5px 10px 0;border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;display:flex;flex-wrap:wrap;align-items:center;position:relative}.sky-toolbar-container ::ng-deep sky-toolbar-section:not(:first-child) .sky-toolbar-section{border-top:1px solid #cdcfd2}.sky-toolbar-container:not(.sky-toolbar-sectioned){flex-wrap:nowrap}.sky-toolbar-sectioned{display:block;padding:0}.sky-toolbar-items{display:flex;flex-wrap:wrap;align-items:center}:host-context(.sky-theme-modern .sky-viewkeeper-fixed) .sky-toolbar-container{background-color:#fcfcfc}:host-context(.sky-theme-modern.sky-theme-mode-dark .sky-viewkeeper-fixed) .sky-toolbar-container{background-color:#121212}:host-context(.sky-theme-modern) .sky-toolbar-container{background-color:transparent;border:none;padding:10px 0}:host-context(.sky-theme-modern) .sky-toolbar-container.sky-viewkeeper-fixed{background-color:#fcfcfc}:host-context(.sky-theme-modern) .sky-toolbar-container ::ng-deep sky-toolbar-section:not(:first-child) .sky-toolbar-section{border-top:1px solid #d2d2d2}:host-context(.sky-theme-modern) .sky-toolbar-sectioned{padding:0}.sky-theme-modern .sky-toolbar-container{background-color:transparent;border:none;padding:10px 0}.sky-theme-modern .sky-toolbar-container.sky-viewkeeper-fixed{background-color:#fcfcfc}.sky-theme-modern .sky-toolbar-container ::ng-deep sky-toolbar-section:not(:first-child) .sky-toolbar-section{border-top:1px solid #d2d2d2}.sky-theme-modern .sky-toolbar-sectioned{padding:0}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-toolbar-container.sky-viewkeeper-fixed{background-color:#121212}.sky-theme-modern.sky-theme-mode-dark .sky-toolbar-container.sky-viewkeeper-fixed{background-color:#121212}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
2939
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyToolbarComponent, decorators: [{
2940
- type: Component,
2941
- args: [{ selector: 'sky-toolbar', template: "<div\n class=\"sky-toolbar-container\"\n [ngClass]=\"{ 'sky-toolbar-sectioned': hasSections }\"\n>\n <ng-content select=\"sky-toolbar-section\"></ng-content>\n <div class=\"sky-toolbar-items\">\n <ng-content></ng-content>\n </div>\n <ng-content select=\"sky-toolbar-view-actions\"></ng-content>\n</div>\n", styles: ["sky-toolbar+:host .sky-toolbar-container{border-top:none}.sky-toolbar-container{min-height:49px;background-color:#fff;padding:5px 10px 0;border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;display:flex;flex-wrap:wrap;align-items:center;position:relative}.sky-toolbar-container ::ng-deep sky-toolbar-section:not(:first-child) .sky-toolbar-section{border-top:1px solid #cdcfd2}.sky-toolbar-container:not(.sky-toolbar-sectioned){flex-wrap:nowrap}.sky-toolbar-sectioned{display:block;padding:0}.sky-toolbar-items{display:flex;flex-wrap:wrap;align-items:center}:host-context(.sky-theme-modern .sky-viewkeeper-fixed) .sky-toolbar-container{background-color:#fcfcfc}:host-context(.sky-theme-modern.sky-theme-mode-dark .sky-viewkeeper-fixed) .sky-toolbar-container{background-color:#121212}:host-context(.sky-theme-modern) .sky-toolbar-container{background-color:transparent;border:none;padding:10px 0}:host-context(.sky-theme-modern) .sky-toolbar-container.sky-viewkeeper-fixed{background-color:#fcfcfc}:host-context(.sky-theme-modern) .sky-toolbar-container ::ng-deep sky-toolbar-section:not(:first-child) .sky-toolbar-section{border-top:1px solid #d2d2d2}:host-context(.sky-theme-modern) .sky-toolbar-sectioned{padding:0}.sky-theme-modern .sky-toolbar-container{background-color:transparent;border:none;padding:10px 0}.sky-theme-modern .sky-toolbar-container.sky-viewkeeper-fixed{background-color:#fcfcfc}.sky-theme-modern .sky-toolbar-container ::ng-deep sky-toolbar-section:not(:first-child) .sky-toolbar-section{border-top:1px solid #d2d2d2}.sky-theme-modern .sky-toolbar-sectioned{padding:0}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-toolbar-container.sky-viewkeeper-fixed{background-color:#121212}.sky-theme-modern.sky-theme-mode-dark .sky-toolbar-container.sky-viewkeeper-fixed{background-color:#121212}\n"] }]
2942
- }], propDecorators: { sectionComponents: [{
2943
- type: ContentChildren,
2944
- args: [SkyToolbarSectionComponent, { descendants: true }]
2945
- }] } });
2946
-
2947
- class SkyToolbarModule {
2948
- }
2949
- SkyToolbarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyToolbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2950
- SkyToolbarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SkyToolbarModule, declarations: [SkyToolbarComponent,
2951
- SkyToolbarItemComponent,
2952
- SkyToolbarSectionComponent,
2953
- SkyToolbarViewActionsComponent], imports: [CommonModule], exports: [SkyToolbarComponent,
2954
- SkyToolbarItemComponent,
2955
- SkyToolbarSectionComponent,
2956
- SkyToolbarViewActionsComponent] });
2957
- SkyToolbarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyToolbarModule, imports: [CommonModule] });
2958
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SkyToolbarModule, decorators: [{
2959
- type: NgModule,
2960
- args: [{
2961
- declarations: [
2962
- SkyToolbarComponent,
2963
- SkyToolbarItemComponent,
2964
- SkyToolbarSectionComponent,
2965
- SkyToolbarViewActionsComponent,
2966
- ],
2967
- imports: [CommonModule],
2968
- exports: [
2969
- SkyToolbarComponent,
2970
- SkyToolbarItemComponent,
2971
- SkyToolbarSectionComponent,
2972
- SkyToolbarViewActionsComponent,
2973
- ],
2974
- }]
2975
- }] });
2976
-
2977
- /**
2978
- * Generated bundle index. Do not edit.
2979
- */
2980
-
2981
- export { SkyActionButtonModule, SkyBackToTopMessageType, SkyBackToTopModule, SkyBoxModule, SkyCardModule, SkyDefinitionListModule, SkyDescriptionListMode, SkyDescriptionListModule, SkyFluidGridModule, SkyFormatModule, SkyInlineDeleteModule, SkyInlineDeleteType, SkyPageModule, SkyPageSummaryModule, SkyTextExpandModule, SkyTextExpandRepeaterModule, SkyToolbarModule, SkyActionButtonComponent as λ1, SkyCardActionsComponent as λ10, SkyCardContentComponent as λ11, SkyCardTitleComponent as λ12, SkyDefinitionListComponent as λ13, SkyDefinitionListContentComponent as λ14, SkyDefinitionListHeadingComponent as λ15, SkyDefinitionListLabelComponent as λ16, SkyDefinitionListValueComponent as λ17, SkyDescriptionListComponent as λ18, SkyDescriptionListTermComponent as λ19, SkyActionButtonContainerComponent as λ2, SkyDescriptionListDescriptionComponent as λ20, SkyDescriptionListContentComponent as λ21, SkyFluidGridComponent as λ22, SkyRowComponent as λ23, SkyColumnComponent as λ24, SkyFormatComponent as λ25, SkyPageComponent as λ26, SkyPageSummaryComponent as λ27, SkyPageSummaryAlertComponent as λ28, SkyPageSummaryContentComponent as λ29, SkyActionButtonDetailsComponent as λ3, SkyPageSummaryImageComponent as λ30, SkyPageSummaryKeyInfoComponent as λ31, SkyPageSummaryStatusComponent as λ32, SkyPageSummarySubtitleComponent as λ33, SkyPageSummaryTitleComponent as λ34, SkyTextExpandComponent as λ35, SkyTextExpandRepeaterComponent as λ36, SkyToolbarComponent as λ37, SkyToolbarSectionComponent as λ38, SkyToolbarItemComponent as λ39, SkyActionButtonHeaderComponent as λ4, SkyToolbarViewActionsComponent as λ40, SkyBoxComponent as λ41, SkyBoxHeaderComponent as λ42, SkyBoxContentComponent as λ43, SkyBoxControlsComponent as λ44, SkyActionButtonIconComponent as λ5, SkyBackToTopComponent as λ6, SkyBackToTopDirective as λ7, SkyInlineDeleteComponent as λ8, SkyCardComponent as λ9 };
2982
- //# sourceMappingURL=skyux-layout.mjs.map