@skyux/indicators 6.17.1 → 6.19.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 (58) hide show
  1. package/documentation.json +1229 -413
  2. package/esm2020/index.mjs +2 -1
  3. package/esm2020/lib/modules/icon/icon-stack.component.mjs +1 -1
  4. package/esm2020/lib/modules/icon/icon.component.mjs +1 -10
  5. package/esm2020/lib/modules/key-info/key-info-layout-type.mjs +2 -0
  6. package/esm2020/lib/modules/key-info/key-info.component.mjs +1 -1
  7. package/esm2020/lib/modules/status-indicator/status-indicator.component.mjs +6 -6
  8. package/esm2020/lib/modules/tokens/token.component.mjs +31 -29
  9. package/esm2020/lib/modules/tokens/tokens.component.mjs +100 -86
  10. package/esm2020/lib/modules/wait/wait-adapter.service.mjs +131 -128
  11. package/esm2020/lib/modules/wait/wait-page.component.mjs +1 -1
  12. package/esm2020/lib/modules/wait/wait.component.mjs +83 -36
  13. package/esm2020/lib/modules/wait/wait.service.mjs +80 -73
  14. package/esm2020/testing/alert/alert-harness-filters.mjs +1 -1
  15. package/esm2020/testing/alert/alert-harness.mjs +53 -8
  16. package/esm2020/testing/key-info/key-info-harness-filters.mjs +2 -0
  17. package/esm2020/testing/key-info/key-info-harness.mjs +50 -0
  18. package/esm2020/testing/key-info/key-info-label-harness.mjs +18 -0
  19. package/esm2020/testing/key-info/key-info-value-harness.mjs +18 -0
  20. package/esm2020/testing/label/label-harness-filters.mjs +2 -0
  21. package/esm2020/testing/label/label-harness.mjs +96 -0
  22. package/esm2020/testing/public-api.mjs +7 -3
  23. package/esm2020/testing/tokens/token-harness.mjs +6 -3
  24. package/esm2020/testing/tokens/tokens-harness.mjs +4 -1
  25. package/esm2020/testing/wait-fixture.mjs +1 -1
  26. package/fesm2015/skyux-indicators-testing.mjs +332 -85
  27. package/fesm2015/skyux-indicators-testing.mjs.map +1 -1
  28. package/fesm2015/skyux-indicators.mjs +423 -364
  29. package/fesm2015/skyux-indicators.mjs.map +1 -1
  30. package/fesm2020/skyux-indicators-testing.mjs +300 -75
  31. package/fesm2020/skyux-indicators-testing.mjs.map +1 -1
  32. package/fesm2020/skyux-indicators.mjs +422 -364
  33. package/fesm2020/skyux-indicators.mjs.map +1 -1
  34. package/index.d.ts +1 -0
  35. package/lib/modules/icon/icon-stack.component.d.ts +1 -1
  36. package/lib/modules/icon/icon.component.d.ts +4 -4
  37. package/lib/modules/key-info/key-info-layout-type.d.ts +1 -0
  38. package/lib/modules/key-info/key-info.component.d.ts +2 -1
  39. package/lib/modules/status-indicator/status-indicator.component.d.ts +8 -8
  40. package/lib/modules/tokens/token.component.d.ts +10 -27
  41. package/lib/modules/tokens/tokens.component.d.ts +17 -34
  42. package/lib/modules/wait/wait-adapter.service.d.ts +3 -13
  43. package/lib/modules/wait/wait-page.component.d.ts +2 -2
  44. package/lib/modules/wait/wait.component.d.ts +12 -16
  45. package/lib/modules/wait/wait.service.d.ts +1 -11
  46. package/package.json +5 -5
  47. package/testing/alert/alert-harness-filters.d.ts +0 -1
  48. package/testing/alert/alert-harness.d.ts +12 -2
  49. package/testing/key-info/key-info-harness-filters.d.ts +7 -0
  50. package/testing/key-info/key-info-harness.d.ts +32 -0
  51. package/testing/key-info/key-info-label-harness.d.ts +15 -0
  52. package/testing/key-info/key-info-value-harness.d.ts +15 -0
  53. package/testing/label/label-harness-filters.d.ts +7 -0
  54. package/testing/label/label-harness.d.ts +36 -0
  55. package/testing/public-api.d.ts +6 -2
  56. package/testing/tokens/token-harness.d.ts +3 -0
  57. package/testing/tokens/tokens-harness.d.ts +3 -0
  58. package/testing/wait-fixture.d.ts +1 -1
@@ -11,7 +11,7 @@ import * as i2 from '@skyux/core';
11
11
  import { SkyTrimModule, MutationObserverService } from '@skyux/core';
12
12
  import { trigger, transition, style, animate } from '@angular/animations';
13
13
  import { Subject, BehaviorSubject, defer } from 'rxjs';
14
- import { takeUntil, finalize } from 'rxjs/operators';
14
+ import { takeUntil, take, finalize } from 'rxjs/operators';
15
15
 
16
16
  /**
17
17
  * @internal
@@ -104,15 +104,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
104
104
  }] } });
105
105
 
106
106
  class SkyIconComponent {
107
- constructor() {
108
- /**
109
- * Specifies the type of icon to display. Specifying `"fa"` will display a Font Awesome icon,
110
- * while specifying `"skyux"` will display an icon from the custom SKY UX icon font. Note that
111
- * the custom SKY UX icon font is currently in beta.
112
- * @default "fa"
113
- */
114
- this.iconType = 'fa';
115
- }
116
107
  }
117
108
  SkyIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
118
109
  SkyIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyIconComponent, selector: "sky-icon", inputs: { icon: "icon", iconType: "iconType", size: "size", fixedWidth: "fixedWidth", variant: "variant" }, ngImport: i0, template: "<i\n *ngIf=\"icon\"\n aria-hidden=\"true\"\n class=\"sky-icon\"\n [ngClass]=\"icon | skyIconClassList: iconType:size:fixedWidth:variant\"\n>\n</i>\n", styles: [":host{display:inline-block}i{display:inherit}\n"], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "skyIconClassList": SkyIconClassListPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
@@ -781,7 +772,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
781
772
  }]
782
773
  }] });
783
774
 
784
- var _SkyStatusIndicatorComponent_instances, _SkyStatusIndicatorComponent_changeDetector, _SkyStatusIndicatorComponent_resources, _SkyStatusIndicatorComponent__descriptionType, _SkyStatusIndicatorComponent__customDescription, _SkyStatusIndicatorComponent_updateIcon, _SkyStatusIndicatorComponent_updateDescriptionComputed;
775
+ var _SkyStatusIndicatorComponent_instances, _SkyStatusIndicatorComponent_changeDetector, _SkyStatusIndicatorComponent_resourcesSvc, _SkyStatusIndicatorComponent__descriptionType, _SkyStatusIndicatorComponent__customDescription, _SkyStatusIndicatorComponent_updateIcon, _SkyStatusIndicatorComponent_updateDescriptionComputed;
785
776
  const INDICATOR_TYPE_DEFAULT = 'warning';
786
777
  /**
787
778
  * Displays status text with an icon matching the specified indicator type.
@@ -794,11 +785,11 @@ class SkyStatusIndicatorComponent {
794
785
  _SkyStatusIndicatorComponent_instances.add(this);
795
786
  this.indicatorTypeOrDefault = INDICATOR_TYPE_DEFAULT;
796
787
  _SkyStatusIndicatorComponent_changeDetector.set(this, void 0);
797
- _SkyStatusIndicatorComponent_resources.set(this, void 0);
788
+ _SkyStatusIndicatorComponent_resourcesSvc.set(this, void 0);
798
789
  _SkyStatusIndicatorComponent__descriptionType.set(this, void 0);
799
790
  _SkyStatusIndicatorComponent__customDescription.set(this, void 0);
800
791
  __classPrivateFieldSet(this, _SkyStatusIndicatorComponent_changeDetector, changeDetector, "f");
801
- __classPrivateFieldSet(this, _SkyStatusIndicatorComponent_resources, resources, "f");
792
+ __classPrivateFieldSet(this, _SkyStatusIndicatorComponent_resourcesSvc, resources, "f");
802
793
  }
803
794
  /**
804
795
  * Specifies a style for the status indicator to determine the icon.
@@ -836,7 +827,7 @@ class SkyStatusIndicatorComponent {
836
827
  __classPrivateFieldGet(this, _SkyStatusIndicatorComponent_instances, "m", _SkyStatusIndicatorComponent_updateIcon).call(this);
837
828
  }
838
829
  }
839
- _SkyStatusIndicatorComponent_changeDetector = new WeakMap(), _SkyStatusIndicatorComponent_resources = new WeakMap(), _SkyStatusIndicatorComponent__descriptionType = new WeakMap(), _SkyStatusIndicatorComponent__customDescription = new WeakMap(), _SkyStatusIndicatorComponent_instances = new WeakSet(), _SkyStatusIndicatorComponent_updateIcon = function _SkyStatusIndicatorComponent_updateIcon() {
830
+ _SkyStatusIndicatorComponent_changeDetector = new WeakMap(), _SkyStatusIndicatorComponent_resourcesSvc = new WeakMap(), _SkyStatusIndicatorComponent__descriptionType = new WeakMap(), _SkyStatusIndicatorComponent__customDescription = new WeakMap(), _SkyStatusIndicatorComponent_instances = new WeakSet(), _SkyStatusIndicatorComponent_updateIcon = function _SkyStatusIndicatorComponent_updateIcon() {
840
831
  const indicatorIcon = SkyIndicatorIconUtility.getIconsForType(this.indicatorTypeOrDefault);
841
832
  this.icon = indicatorIcon.defaultThemeIcon;
842
833
  this.baseIcon = indicatorIcon.modernThemeBaseIcon;
@@ -851,7 +842,7 @@ _SkyStatusIndicatorComponent_changeDetector = new WeakMap(), _SkyStatusIndicator
851
842
  this.descriptionComputed = this.customDescription;
852
843
  break;
853
844
  default:
854
- __classPrivateFieldGet(this, _SkyStatusIndicatorComponent_resources, "f")
845
+ __classPrivateFieldGet(this, _SkyStatusIndicatorComponent_resourcesSvc, "f")
855
846
  .getString('skyux_status_indicator_sr_' +
856
847
  this.descriptionType.replace(/-/g, '_'))
857
848
  .subscribe((value) => {
@@ -1074,30 +1065,41 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
1074
1065
  }]
1075
1066
  }] });
1076
1067
 
1068
+ var _SkyTokenComponent_instances, _SkyTokenComponent_ariaLabelOrDefault, _SkyTokenComponent_elementRef, _SkyTokenComponent_resourcesSvc, _SkyTokenComponent__disabled, _SkyTokenComponent__dismissible, _SkyTokenComponent_getDefaultAriaLabel;
1077
1069
  class SkyTokenComponent {
1078
- constructor(elementRef, resourcesService) {
1079
- this.elementRef = elementRef;
1080
- this.resourcesService = resourcesService;
1070
+ constructor(elementRef, resourcesSvc) {
1071
+ _SkyTokenComponent_instances.add(this);
1081
1072
  /**
1082
- * Fires when users click the close button or press the `Backspace` key to dismiss the token.
1073
+ * Fires when users click the close button.
1083
1074
  */
1084
1075
  this.dismiss = new EventEmitter();
1085
1076
  /**
1086
1077
  * Fires when users place focus on the token by navigating to it with the `Tab` key.
1087
1078
  */
1088
1079
  this.tokenFocus = new EventEmitter();
1080
+ this.tokenActive = false;
1081
+ this.closeActive = false;
1082
+ this.tabIndex = 0;
1083
+ _SkyTokenComponent_ariaLabelOrDefault.set(this, void 0);
1084
+ _SkyTokenComponent_elementRef.set(this, void 0);
1085
+ _SkyTokenComponent_resourcesSvc.set(this, void 0);
1086
+ _SkyTokenComponent__disabled.set(this, false);
1087
+ _SkyTokenComponent__dismissible.set(this, true);
1088
+ __classPrivateFieldSet(this, _SkyTokenComponent_elementRef, elementRef, "f");
1089
+ __classPrivateFieldSet(this, _SkyTokenComponent_resourcesSvc, resourcesSvc, "f");
1090
+ __classPrivateFieldSet(this, _SkyTokenComponent_ariaLabelOrDefault, __classPrivateFieldGet(this, _SkyTokenComponent_instances, "m", _SkyTokenComponent_getDefaultAriaLabel).call(this), "f");
1089
1091
  }
1090
1092
  /**
1091
1093
  * Indicates whether to disable the token to prevent users from selecting it, dismissing it,
1092
1094
  * or navigating to it with the arrow keys. When the token is disabled,
1093
1095
  * users can still place focus on it using the `Tab` key.
1094
- * @default true
1096
+ * @default false
1095
1097
  */
1096
1098
  set disabled(value) {
1097
- this._disabled = value;
1099
+ __classPrivateFieldSet(this, _SkyTokenComponent__disabled, !!value, "f");
1098
1100
  }
1099
1101
  get disabled() {
1100
- return !!this._disabled;
1102
+ return __classPrivateFieldGet(this, _SkyTokenComponent__disabled, "f");
1101
1103
  }
1102
1104
  /**
1103
1105
  * Specifies an ARIA label for the token's close button. This sets the button's `aria-label`
@@ -1105,21 +1107,20 @@ class SkyTokenComponent {
1105
1107
  * @default "Remove item"
1106
1108
  */
1107
1109
  set ariaLabel(value) {
1108
- this._ariaLabel = value;
1110
+ __classPrivateFieldSet(this, _SkyTokenComponent_ariaLabelOrDefault, value || __classPrivateFieldGet(this, _SkyTokenComponent_instances, "m", _SkyTokenComponent_getDefaultAriaLabel).call(this), "f");
1109
1111
  }
1110
1112
  get ariaLabel() {
1111
- return (this._ariaLabel || this.getString('skyux_tokens_dismiss_button_title'));
1113
+ return __classPrivateFieldGet(this, _SkyTokenComponent_ariaLabelOrDefault, "f");
1112
1114
  }
1113
1115
  /**
1114
- * Indicates whether users can remove the token from the list by selecting the close button
1115
- * or pressing the `Backspace` key.
1116
+ * Indicates whether users can remove the token from the list by selecting the close button.
1116
1117
  * @default true
1117
1118
  */
1118
1119
  set dismissible(value) {
1119
- this._dismissible = value;
1120
+ __classPrivateFieldSet(this, _SkyTokenComponent__dismissible, value !== false, "f");
1120
1121
  }
1121
1122
  get dismissible() {
1122
- return this._dismissible !== false;
1123
+ return __classPrivateFieldGet(this, _SkyTokenComponent__dismissible, "f");
1123
1124
  }
1124
1125
  /**
1125
1126
  * Indicates whether users can press the `Tab` key to place focus on the token. This does not
@@ -1127,23 +1128,14 @@ class SkyTokenComponent {
1127
1128
  * @default true
1128
1129
  */
1129
1130
  set focusable(value) {
1130
- this._focusable = value;
1131
- }
1132
- get focusable() {
1133
- return this._focusable !== false;
1134
- }
1135
- /**
1136
- * @internal
1137
- */
1138
- get tabIndex() {
1139
- return this.focusable ? 0 : -1;
1131
+ this.tabIndex = value !== false ? 0 : -1;
1140
1132
  }
1141
1133
  dismissToken(event) {
1142
1134
  event.stopPropagation();
1143
1135
  this.dismiss.emit();
1144
1136
  }
1145
1137
  focusElement() {
1146
- this.elementRef.nativeElement.querySelector('.sky-token').focus();
1138
+ __classPrivateFieldGet(this, _SkyTokenComponent_elementRef, "f").nativeElement.querySelector('.sky-token').focus();
1147
1139
  }
1148
1140
  setTokenActive(tokenActive) {
1149
1141
  this.tokenActive = tokenActive;
@@ -1151,11 +1143,11 @@ class SkyTokenComponent {
1151
1143
  setCloseActive(closeActive) {
1152
1144
  this.closeActive = closeActive;
1153
1145
  }
1154
- getString(key) {
1155
- // TODO: Need to implement the async `getString` method in a breaking change.
1156
- return this.resourcesService.getStringForLocale({ locale: 'en-US' }, key);
1157
- }
1158
1146
  }
1147
+ _SkyTokenComponent_ariaLabelOrDefault = new WeakMap(), _SkyTokenComponent_elementRef = new WeakMap(), _SkyTokenComponent_resourcesSvc = new WeakMap(), _SkyTokenComponent__disabled = new WeakMap(), _SkyTokenComponent__dismissible = new WeakMap(), _SkyTokenComponent_instances = new WeakSet(), _SkyTokenComponent_getDefaultAriaLabel = function _SkyTokenComponent_getDefaultAriaLabel() {
1148
+ // TODO: Need to implement the async `getString` method in a breaking change.
1149
+ return __classPrivateFieldGet(this, _SkyTokenComponent_resourcesSvc, "f").getStringForLocale({ locale: 'en-US' }, 'skyux_tokens_dismiss_button_title');
1150
+ };
1159
1151
  SkyTokenComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyTokenComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.SkyLibResourcesService }], target: i0.ɵɵFactoryTarget.Component });
1160
1152
  SkyTokenComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyTokenComponent, selector: "sky-token", inputs: { disabled: "disabled", ariaLabel: "ariaLabel", dismissible: "dismissible", focusable: "focusable" }, outputs: { dismiss: "dismiss", tokenFocus: "tokenFocus" }, ngImport: i0, template: "<div\n class=\"sky-token sky-btn sky-btn-default\"\n role=\"button\"\n [attr.aria-disabled]=\"disabled\"\n [attr.tabindex]=\"tabIndex\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled,\n 'sky-token-dismissable': dismissible,\n 'sky-token-active': tokenActive && !closeActive\n }\"\n (document:mouseup)=\"setTokenActive(false)\"\n (focus)=\"tokenFocus.emit()\"\n (mousedown)=\"setTokenActive(true)\"\n>\n <ng-content></ng-content>\n <button\n *ngIf=\"dismissible\"\n class=\"sky-btn sky-token-btn-close\"\n type=\"button\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.tabindex]=\"tabIndex\"\n [attr.title]=\"ariaLabel\"\n [disabled]=\"disabled\"\n [ngClass]=\"{\n 'sky-token-btn-close-active': closeActive\n }\"\n (click)=\"dismissToken($event)\"\n (document:mouseup)=\"setCloseActive(false)\"\n (mousedown)=\"setCloseActive(true)\"\n >\n <sky-icon class=\"sky-token-btn-close-icon-default\" icon=\"times\"></sky-icon>\n <sky-icon\n class=\"sky-token-btn-close-icon-modern\"\n icon=\"close\"\n iconType=\"skyux\"\n >\n </sky-icon>\n </button>\n</div>\n", styles: [".sky-token{background-color:#c1e8fb;border:1px solid #00b4f1;overflow:hidden;padding:2px 8px;display:inline-block;-webkit-user-select:none;user-select:none}.sky-token:hover,.sky-token:focus{background-color:#91d6f8;border-color:#008ebe;cursor:pointer}.sky-token:focus{box-shadow:0 0 8px #00b4f199;border:1px solid #00b4f1;outline:none}.sky-btn-disabled{cursor:default;-webkit-user-select:none;user-select:none}.sky-token-btn-close{background:transparent;padding:0;border:0;margin-left:2px;opacity:.9}.sky-token-btn-close:hover,.sky-token-btn-close:focus{opacity:1}.sky-token-btn-close-icon-modern{display:none}:host-context(.sky-theme-modern) .sky-token{align-items:center;display:inline-flex;padding:1px 5px;font-size:14px}:host-context(.sky-theme-modern) .sky-token.sky-btn-disabled{color:#212327}:host-context(.sky-theme-modern) .sky-token:not(.sky-btn-disabled){border:none;box-shadow:inset 0 0 0 1px #81d4f7}:host-context(.sky-theme-modern) .sky-token.sky-token-dismissable{padding-right:1px}:host-context(.sky-theme-modern) .sky-token:hover:not(:active){border:none;box-shadow:inset 0 0 0 1px #1870b8}:host-context(.sky-theme-modern) .sky-token.sky-token-active{border:none;box-shadow:inset 0 0 0 2px #1870b8}:host-context(.sky-theme-modern) .sky-token:focus:not(:active){border:none;box-shadow:inset 0 0 0 2px #1870b8,0 1px 3px #0000004d}:host-context(.sky-theme-modern) .sky-token:focus,:host-context(.sky-theme-modern) .sky-token:hover{background-color:#c1e8fb}:host-context(.sky-theme-modern) .sky-token-btn-close{align-items:center;border-radius:5px;display:flex;height:20px;margin-left:5px;width:20px}:host-context(.sky-theme-modern) .sky-token-btn-close:hover{border:none;box-shadow:inset 0 0 0 1px transparent}:host-context(.sky-theme-modern) .sky-token-btn-close.sky-token-btn-close-active{border:none;box-shadow:inset 0 0 0 2px #1870b8}:host-context(.sky-theme-modern) .sky-token-btn-close:focus{outline:none}:host-context(.sky-theme-modern) .sky-token-btn-close:focus:not(:active){border:none;box-shadow:inset 0 0 0 2px #1870b8,0 1px 3px #0000004d}:host-context(.sky-theme-modern) .sky-token-btn-close-icon-default{display:none}:host-context(.sky-theme-modern) .sky-token-btn-close-icon-modern{display:inline-block;width:100%}.sky-theme-modern .sky-token{align-items:center;display:inline-flex;padding:1px 5px;font-size:14px}.sky-theme-modern .sky-token.sky-btn-disabled{color:#212327}.sky-theme-modern .sky-token:not(.sky-btn-disabled){border:none;box-shadow:inset 0 0 0 1px #81d4f7}.sky-theme-modern .sky-token.sky-token-dismissable{padding-right:1px}.sky-theme-modern .sky-token:hover:not(:active){border:none;box-shadow:inset 0 0 0 1px #1870b8}.sky-theme-modern .sky-token.sky-token-active{border:none;box-shadow:inset 0 0 0 2px #1870b8}.sky-theme-modern .sky-token:focus:not(:active){border:none;box-shadow:inset 0 0 0 2px #1870b8,0 1px 3px #0000004d}.sky-theme-modern .sky-token:focus,.sky-theme-modern .sky-token:hover{background-color:#c1e8fb}.sky-theme-modern .sky-token-btn-close{align-items:center;border-radius:5px;display:flex;height:20px;margin-left:5px;width:20px}.sky-theme-modern .sky-token-btn-close:hover{border:none;box-shadow:inset 0 0 0 1px transparent}.sky-theme-modern .sky-token-btn-close.sky-token-btn-close-active{border:none;box-shadow:inset 0 0 0 2px #1870b8}.sky-theme-modern .sky-token-btn-close:focus{outline:none}.sky-theme-modern .sky-token-btn-close:focus:not(:active){border:none;box-shadow:inset 0 0 0 2px #1870b8,0 1px 3px #0000004d}.sky-theme-modern .sky-token-btn-close-icon-default{display:none}.sky-theme-modern .sky-token-btn-close-icon-modern{display:inline-block;width:100%}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-token{background-color:#c1e8fb}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-token,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-token-btn-close{color:#212327}.sky-theme-modern.sky-theme-mode-dark .sky-token{background-color:#c1e8fb}.sky-theme-modern.sky-theme-mode-dark .sky-token,.sky-theme-modern.sky-theme-mode-dark .sky-token-btn-close{color:#212327}\n"], components: [{ type: SkyIconComponent, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }], directives: [{ type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1161
1153
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyTokenComponent, decorators: [{
@@ -1199,16 +1191,23 @@ var SkyTokensMessageType;
1199
1191
  SkyTokensMessageType[SkyTokensMessageType["RemoveActiveToken"] = 4] = "RemoveActiveToken";
1200
1192
  })(SkyTokensMessageType || (SkyTokensMessageType = {}));
1201
1193
 
1194
+ var _SkyTokensComponent_instances, _SkyTokensComponent__disabled, _SkyTokensComponent__dismissible, _SkyTokensComponent__focusable, _SkyTokensComponent__tokens, _SkyTokensComponent__displayWith, _SkyTokensComponent_messageStreamSub, _SkyTokensComponent_ngUnsubscribe, _SkyTokensComponent__messageStream, _SkyTokensComponent_changeDetector, _SkyTokensComponent__activeIndex, _SkyTokensComponent_focusPreviousToken, _SkyTokensComponent_focusNextToken, _SkyTokensComponent_focusLastToken, _SkyTokensComponent_focusActiveToken, _SkyTokensComponent_removeActiveToken, _SkyTokensComponent_initMessageStream, _SkyTokensComponent_notifyTokenSelected;
1195
+ const DISPLAY_WITH_DEFAULT = 'name';
1196
+ /**
1197
+ * Creates a container that enables navigation between tokens using keyboard arrow keys.
1198
+ * This is useful when combined with other components where the <kbd>Tab<kbd> key is
1199
+ * reserved for other functions, such as the SKY UX Lookup component.
1200
+ */
1202
1201
  class SkyTokensComponent {
1203
1202
  constructor(changeDetector) {
1204
- this.changeDetector = changeDetector;
1203
+ _SkyTokensComponent_instances.add(this);
1205
1204
  /**
1206
1205
  * Fires when users navigate through the tokens list with the `Tab` key
1207
1206
  * and attempt to move past the final token in the list.
1208
1207
  */
1209
1208
  this.focusIndexOverRange = new EventEmitter();
1210
1209
  /**
1211
- * Fires when usersnavigate through the tokens list with the `Tab` key
1210
+ * Fires when users navigate through the tokens list with the `Tab` key
1212
1211
  * and attempt to move before the first token in the list.
1213
1212
  */
1214
1213
  this.focusIndexUnderRange = new EventEmitter();
@@ -1221,7 +1220,17 @@ class SkyTokensComponent {
1221
1220
  * This event emits an array of the tokens in the updated list.
1222
1221
  */
1223
1222
  this.tokensChange = new EventEmitter();
1224
- this.ngUnsubscribe = new Subject();
1223
+ _SkyTokensComponent__disabled.set(this, false);
1224
+ _SkyTokensComponent__dismissible.set(this, true);
1225
+ _SkyTokensComponent__focusable.set(this, true);
1226
+ _SkyTokensComponent__tokens.set(this, []);
1227
+ _SkyTokensComponent__displayWith.set(this, DISPLAY_WITH_DEFAULT);
1228
+ _SkyTokensComponent_messageStreamSub.set(this, void 0);
1229
+ _SkyTokensComponent_ngUnsubscribe.set(this, new Subject());
1230
+ _SkyTokensComponent__messageStream.set(this, new Subject());
1231
+ _SkyTokensComponent_changeDetector.set(this, void 0);
1232
+ _SkyTokensComponent__activeIndex.set(this, 0);
1233
+ __classPrivateFieldSet(this, _SkyTokensComponent_changeDetector, changeDetector, "f");
1225
1234
  // Angular calls the trackBy function without applying the component instance's scope.
1226
1235
  // Use a fat-arrow function so the current component instance's trackWith property can
1227
1236
  // be referenced.
@@ -1239,31 +1248,30 @@ class SkyTokensComponent {
1239
1248
  * @default false
1240
1249
  */
1241
1250
  set disabled(value) {
1242
- this._disabled = value;
1251
+ __classPrivateFieldSet(this, _SkyTokensComponent__disabled, !!value, "f");
1243
1252
  }
1244
1253
  get disabled() {
1245
- return !!this._disabled;
1254
+ return __classPrivateFieldGet(this, _SkyTokensComponent__disabled, "f");
1246
1255
  }
1247
1256
  /**
1248
- * Indicates whether users can remove tokens from the list by selecting their close buttons
1249
- * or pressing the `Backspace` key.
1257
+ * Indicates whether users can remove a token from the list by selecting a token's close button.
1250
1258
  * @default true
1251
1259
  */
1252
1260
  set dismissible(value) {
1253
- this._dismissible = value;
1261
+ __classPrivateFieldSet(this, _SkyTokensComponent__dismissible, value !== false, "f");
1254
1262
  }
1255
1263
  get dismissible() {
1256
- return this._dismissible !== false;
1264
+ return __classPrivateFieldGet(this, _SkyTokensComponent__dismissible, "f");
1257
1265
  }
1258
1266
  /**
1259
1267
  * Specifies the token property to display for each item in the tokens list.
1260
1268
  * @default "name"
1261
1269
  */
1262
1270
  set displayWith(value) {
1263
- this._displayWith = value;
1271
+ __classPrivateFieldSet(this, _SkyTokensComponent__displayWith, value || DISPLAY_WITH_DEFAULT, "f");
1264
1272
  }
1265
1273
  get displayWith() {
1266
- return this._displayWith || 'name';
1274
+ return __classPrivateFieldGet(this, _SkyTokensComponent__displayWith, "f");
1267
1275
  }
1268
1276
  /**
1269
1277
  * Indicates whether users can focus on items in the list using the `Tab` key.
@@ -1272,72 +1280,73 @@ class SkyTokensComponent {
1272
1280
  * @default true
1273
1281
  */
1274
1282
  set focusable(value) {
1275
- this._focusable = value;
1283
+ __classPrivateFieldSet(this, _SkyTokensComponent__focusable, value !== false, "f");
1276
1284
  }
1277
1285
  get focusable() {
1278
- return this._focusable !== false;
1286
+ return __classPrivateFieldGet(this, _SkyTokensComponent__focusable, "f");
1279
1287
  }
1280
1288
  /**
1281
1289
  * Specifies an array of tokens to include in the list.
1282
1290
  */
1283
1291
  set tokens(value) {
1284
- this._tokens = value;
1285
- this.tokensChange.emit(this._tokens);
1292
+ __classPrivateFieldSet(this, _SkyTokensComponent__tokens, value || [], "f");
1293
+ // The previous behavior was to set `this._tokens = value`, then emit `this._tokens`,
1294
+ // which would emit `undefined` instead of a default value of `[]` returned by the
1295
+ // get accessor when set to `undefined`. Emitting `value` instead of `this.#_tokensOrDefault`
1296
+ // preserves that behavior.
1297
+ this.tokensChange.emit(value);
1286
1298
  }
1287
1299
  get tokens() {
1288
- return this._tokens || [];
1300
+ return __classPrivateFieldGet(this, _SkyTokensComponent__tokens, "f");
1289
1301
  }
1290
1302
  /**
1291
1303
  * Specifies an observable of `SkyTokensMessage` that can place focus on a
1292
1304
  * particular token or remove the active token from the list.
1293
1305
  */
1294
1306
  set messageStream(value) {
1295
- this._messageStream = value;
1296
- this.initMessageStream();
1307
+ __classPrivateFieldSet(this, _SkyTokensComponent__messageStream, value || new Subject(), "f");
1308
+ __classPrivateFieldGet(this, _SkyTokensComponent_instances, "m", _SkyTokensComponent_initMessageStream).call(this);
1297
1309
  }
1298
1310
  get messageStream() {
1299
- return this._messageStream;
1311
+ return __classPrivateFieldGet(this, _SkyTokensComponent__messageStream, "f");
1300
1312
  }
1301
- /**
1302
- * @internal
1303
- */
1304
1313
  get activeIndex() {
1305
- return this._activeIndex || 0;
1314
+ return __classPrivateFieldGet(this, _SkyTokensComponent__activeIndex, "f");
1306
1315
  }
1307
1316
  set activeIndex(value) {
1308
- if (value >= this.tokens.length) {
1309
- value = this.tokens.length - 1;
1317
+ if (value >= __classPrivateFieldGet(this, _SkyTokensComponent__tokens, "f").length) {
1318
+ value = __classPrivateFieldGet(this, _SkyTokensComponent__tokens, "f").length - 1;
1310
1319
  this.focusIndexOverRange.emit();
1311
1320
  }
1312
1321
  if (value < 0) {
1313
1322
  value = 0;
1314
1323
  this.focusIndexUnderRange.emit();
1315
1324
  }
1316
- this._activeIndex = value;
1325
+ __classPrivateFieldSet(this, _SkyTokensComponent__activeIndex, value || 0, "f");
1317
1326
  }
1318
1327
  ngOnDestroy() {
1319
- this.ngUnsubscribe.next();
1320
- this.ngUnsubscribe.complete();
1328
+ __classPrivateFieldGet(this, _SkyTokensComponent_ngUnsubscribe, "f").next();
1329
+ __classPrivateFieldGet(this, _SkyTokensComponent_ngUnsubscribe, "f").complete();
1321
1330
  }
1322
1331
  onTokenClick(token) {
1323
1332
  if (this.disabled) {
1324
1333
  return;
1325
1334
  }
1326
- this.notifyTokenSelected(token);
1335
+ __classPrivateFieldGet(this, _SkyTokensComponent_instances, "m", _SkyTokensComponent_notifyTokenSelected).call(this, token);
1327
1336
  }
1328
1337
  onTokenKeyDown(event) {
1329
1338
  if (!this.disabled) {
1330
1339
  switch (event.key) {
1331
1340
  case 'Left':
1332
1341
  case 'ArrowLeft':
1333
- this.messageStream.next({
1342
+ __classPrivateFieldGet(this, _SkyTokensComponent__messageStream, "f").next({
1334
1343
  type: SkyTokensMessageType.FocusPreviousToken,
1335
1344
  });
1336
1345
  event.preventDefault();
1337
1346
  break;
1338
1347
  case 'Right':
1339
1348
  case 'ArrowRight':
1340
- this.messageStream.next({
1349
+ __classPrivateFieldGet(this, _SkyTokensComponent__messageStream, "f").next({
1341
1350
  type: SkyTokensMessageType.FocusNextToken,
1342
1351
  });
1343
1352
  event.preventDefault();
@@ -1347,26 +1356,27 @@ class SkyTokensComponent {
1347
1356
  }
1348
1357
  selectToken(token) {
1349
1358
  if (!this.disabled) {
1350
- this.notifyTokenSelected(token);
1359
+ __classPrivateFieldGet(this, _SkyTokensComponent_instances, "m", _SkyTokensComponent_notifyTokenSelected).call(this, token);
1351
1360
  }
1352
1361
  }
1353
1362
  removeToken(token) {
1354
1363
  this.tokens = this.tokens.filter((t) => t !== token);
1355
- this.changeDetector.detectChanges();
1356
- }
1357
- focusPreviousToken() {
1358
- this.activeIndex--;
1359
- this.focusActiveToken();
1360
- }
1361
- focusNextToken() {
1362
- this.activeIndex++;
1363
- this.focusActiveToken();
1364
+ __classPrivateFieldGet(this, _SkyTokensComponent_changeDetector, "f").detectChanges();
1364
1365
  }
1365
- focusLastToken() {
1366
+ }
1367
+ _SkyTokensComponent__disabled = new WeakMap(), _SkyTokensComponent__dismissible = new WeakMap(), _SkyTokensComponent__focusable = new WeakMap(), _SkyTokensComponent__tokens = new WeakMap(), _SkyTokensComponent__displayWith = new WeakMap(), _SkyTokensComponent_messageStreamSub = new WeakMap(), _SkyTokensComponent_ngUnsubscribe = new WeakMap(), _SkyTokensComponent__messageStream = new WeakMap(), _SkyTokensComponent_changeDetector = new WeakMap(), _SkyTokensComponent__activeIndex = new WeakMap(), _SkyTokensComponent_instances = new WeakSet(), _SkyTokensComponent_focusPreviousToken = function _SkyTokensComponent_focusPreviousToken() {
1368
+ this.activeIndex--;
1369
+ __classPrivateFieldGet(this, _SkyTokensComponent_instances, "m", _SkyTokensComponent_focusActiveToken).call(this);
1370
+ }, _SkyTokensComponent_focusNextToken = function _SkyTokensComponent_focusNextToken() {
1371
+ this.activeIndex++;
1372
+ __classPrivateFieldGet(this, _SkyTokensComponent_instances, "m", _SkyTokensComponent_focusActiveToken).call(this);
1373
+ }, _SkyTokensComponent_focusLastToken = function _SkyTokensComponent_focusLastToken() {
1374
+ if (this.tokenComponents) {
1366
1375
  this.activeIndex = this.tokenComponents.length - 1;
1367
- this.focusActiveToken();
1376
+ __classPrivateFieldGet(this, _SkyTokensComponent_instances, "m", _SkyTokensComponent_focusActiveToken).call(this);
1368
1377
  }
1369
- focusActiveToken() {
1378
+ }, _SkyTokensComponent_focusActiveToken = function _SkyTokensComponent_focusActiveToken() {
1379
+ if (this.tokenComponents) {
1370
1380
  const tokenComponent = this.tokenComponents.find((_comp, i) => {
1371
1381
  return this.activeIndex === i;
1372
1382
  });
@@ -1374,48 +1384,43 @@ class SkyTokensComponent {
1374
1384
  tokenComponent.focusElement();
1375
1385
  }
1376
1386
  }
1377
- removeActiveToken() {
1378
- const token = this.tokens[this.activeIndex];
1379
- if (token) {
1380
- this.removeToken(token);
1381
- }
1382
- }
1383
- initMessageStream() {
1384
- if (this.messageStreamSub) {
1385
- this.messageStreamSub.unsubscribe();
1386
- }
1387
- if (this.messageStream) {
1388
- this.messageStreamSub = this.messageStream
1389
- .pipe(takeUntil(this.ngUnsubscribe))
1390
- .subscribe((message) => {
1391
- switch (message.type) {
1392
- case SkyTokensMessageType.FocusLastToken:
1393
- this.focusLastToken();
1394
- break;
1395
- case SkyTokensMessageType.FocusActiveToken:
1396
- this.focusActiveToken();
1397
- break;
1398
- case SkyTokensMessageType.FocusPreviousToken:
1399
- this.focusPreviousToken();
1400
- break;
1401
- case SkyTokensMessageType.FocusNextToken:
1402
- this.focusNextToken();
1403
- break;
1404
- case SkyTokensMessageType.RemoveActiveToken:
1405
- this.removeActiveToken();
1406
- break;
1407
- }
1408
- });
1387
+ }, _SkyTokensComponent_removeActiveToken = function _SkyTokensComponent_removeActiveToken() {
1388
+ const token = this.tokens[this.activeIndex];
1389
+ if (token) {
1390
+ this.removeToken(token);
1391
+ }
1392
+ }, _SkyTokensComponent_initMessageStream = function _SkyTokensComponent_initMessageStream() {
1393
+ if (__classPrivateFieldGet(this, _SkyTokensComponent_messageStreamSub, "f")) {
1394
+ __classPrivateFieldGet(this, _SkyTokensComponent_messageStreamSub, "f").unsubscribe();
1395
+ }
1396
+ __classPrivateFieldSet(this, _SkyTokensComponent_messageStreamSub, this.messageStream
1397
+ .pipe(takeUntil(__classPrivateFieldGet(this, _SkyTokensComponent_ngUnsubscribe, "f")))
1398
+ .subscribe((message) => {
1399
+ switch (message.type) {
1400
+ case SkyTokensMessageType.FocusLastToken:
1401
+ __classPrivateFieldGet(this, _SkyTokensComponent_instances, "m", _SkyTokensComponent_focusLastToken).call(this);
1402
+ break;
1403
+ case SkyTokensMessageType.FocusActiveToken:
1404
+ __classPrivateFieldGet(this, _SkyTokensComponent_instances, "m", _SkyTokensComponent_focusActiveToken).call(this);
1405
+ break;
1406
+ case SkyTokensMessageType.FocusPreviousToken:
1407
+ __classPrivateFieldGet(this, _SkyTokensComponent_instances, "m", _SkyTokensComponent_focusPreviousToken).call(this);
1408
+ break;
1409
+ case SkyTokensMessageType.FocusNextToken:
1410
+ __classPrivateFieldGet(this, _SkyTokensComponent_instances, "m", _SkyTokensComponent_focusNextToken).call(this);
1411
+ break;
1412
+ case SkyTokensMessageType.RemoveActiveToken:
1413
+ __classPrivateFieldGet(this, _SkyTokensComponent_instances, "m", _SkyTokensComponent_removeActiveToken).call(this);
1414
+ break;
1409
1415
  }
1410
- }
1411
- notifyTokenSelected(token) {
1412
- this.tokenSelected.emit({
1413
- token,
1414
- });
1415
- }
1416
- }
1416
+ }), "f");
1417
+ }, _SkyTokensComponent_notifyTokenSelected = function _SkyTokensComponent_notifyTokenSelected(token) {
1418
+ this.tokenSelected.emit({
1419
+ token,
1420
+ });
1421
+ };
1417
1422
  SkyTokensComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyTokensComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1418
- SkyTokensComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyTokensComponent, selector: "sky-tokens", inputs: { disabled: "disabled", dismissible: "dismissible", displayWith: "displayWith", trackWith: "trackWith", focusable: "focusable", tokens: "tokens", messageStream: "messageStream" }, outputs: { focusIndexOverRange: "focusIndexOverRange", focusIndexUnderRange: "focusIndexUnderRange", tokenSelected: "tokenSelected", tokensChange: "tokensChange" }, viewQueries: [{ propertyName: "tokenComponents", predicate: SkyTokenComponent, descendants: true }], ngImport: i0, template: "<div\n *ngIf=\"tokens\"\n class=\"sky-tokens\"\n [@blockAnimationOnLoad]\n [attr.role]=\"tokens && tokens.length ? 'list' : null\"\n>\n <sky-token\n *ngFor=\"let token of tokens; let i = index; trackBy: trackTokenFn\"\n role=\"listitem\"\n [@.disabled]=\"!trackWith\"\n [@dismiss]\n [disabled]=\"disabled\"\n [dismissible]=\"dismissible\"\n [focusable]=\"focusable\"\n (dismiss)=\"removeToken(token)\"\n (click)=\"onTokenClick(token)\"\n (keydown)=\"onTokenKeyDown($event)\"\n (keyup.enter)=\"selectToken(token); $event.preventDefault()\"\n (tokenFocus)=\"activeIndex = i\"\n >\n {{ token.value[displayWith] }}\n </sky-token>\n <div class=\"sky-tokens-content\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";.sky-tokens{display:flex;flex-wrap:wrap;align-items:baseline;margin:-2px}.sky-tokens .sky-tokens-content,.sky-tokens ::ng-deep sky-token{flex:0 0 auto;display:inline-flex;padding:2px}.sky-tokens .sky-tokens-content{flex-grow:1;flex-basis:0px}.sky-tokens .sky-tokens-content:before{content:\"\\200b\"}\n"], components: [{ type: SkyTokenComponent, selector: "sky-token", inputs: ["disabled", "ariaLabel", "dismissible", "focusable"], outputs: ["dismiss", "tokenFocus"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], animations: [
1423
+ SkyTokensComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyTokensComponent, selector: "sky-tokens", inputs: { disabled: "disabled", dismissible: "dismissible", displayWith: "displayWith", trackWith: "trackWith", focusable: "focusable", tokens: "tokens", messageStream: "messageStream" }, outputs: { focusIndexOverRange: "focusIndexOverRange", focusIndexUnderRange: "focusIndexUnderRange", tokenSelected: "tokenSelected", tokensChange: "tokensChange" }, viewQueries: [{ propertyName: "tokenComponents", predicate: SkyTokenComponent, descendants: true }], ngImport: i0, template: "<div\n class=\"sky-tokens\"\n [@blockAnimationOnLoad]\n [attr.role]=\"tokens.length ? 'list' : null\"\n>\n <sky-token\n *ngFor=\"let token of tokens; let i = index; trackBy: trackTokenFn\"\n role=\"listitem\"\n [@.disabled]=\"!trackWith\"\n [@dismiss]\n [disabled]=\"disabled\"\n [dismissible]=\"dismissible\"\n [focusable]=\"focusable\"\n (dismiss)=\"removeToken(token)\"\n (click)=\"onTokenClick(token)\"\n (keydown)=\"onTokenKeyDown($event)\"\n (keyup.enter)=\"selectToken(token); $event.preventDefault()\"\n (tokenFocus)=\"activeIndex = i\"\n >\n {{ token.value[displayWith] }}\n </sky-token>\n <div class=\"sky-tokens-content\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";.sky-tokens{display:flex;flex-wrap:wrap;align-items:baseline;margin:-2px}.sky-tokens .sky-tokens-content,.sky-tokens ::ng-deep sky-token{flex:0 0 auto;display:inline-flex;padding:2px}.sky-tokens .sky-tokens-content{flex-grow:1;flex-basis:0px}.sky-tokens .sky-tokens-content:before{content:\"\\200b\"}\n"], components: [{ type: SkyTokenComponent, selector: "sky-token", inputs: ["disabled", "ariaLabel", "dismissible", "focusable"], outputs: ["dismiss", "tokenFocus"] }], directives: [{ type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], animations: [
1419
1424
  trigger('blockAnimationOnLoad', [transition(':enter', [])]),
1420
1425
  trigger('dismiss', [
1421
1426
  transition(':enter', [
@@ -1458,7 +1463,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
1458
1463
  })),
1459
1464
  ]),
1460
1465
  ]),
1461
- ], template: "<div\n *ngIf=\"tokens\"\n class=\"sky-tokens\"\n [@blockAnimationOnLoad]\n [attr.role]=\"tokens && tokens.length ? 'list' : null\"\n>\n <sky-token\n *ngFor=\"let token of tokens; let i = index; trackBy: trackTokenFn\"\n role=\"listitem\"\n [@.disabled]=\"!trackWith\"\n [@dismiss]\n [disabled]=\"disabled\"\n [dismissible]=\"dismissible\"\n [focusable]=\"focusable\"\n (dismiss)=\"removeToken(token)\"\n (click)=\"onTokenClick(token)\"\n (keydown)=\"onTokenKeyDown($event)\"\n (keyup.enter)=\"selectToken(token); $event.preventDefault()\"\n (tokenFocus)=\"activeIndex = i\"\n >\n {{ token.value[displayWith] }}\n </sky-token>\n <div class=\"sky-tokens-content\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";.sky-tokens{display:flex;flex-wrap:wrap;align-items:baseline;margin:-2px}.sky-tokens .sky-tokens-content,.sky-tokens ::ng-deep sky-token{flex:0 0 auto;display:inline-flex;padding:2px}.sky-tokens .sky-tokens-content{flex-grow:1;flex-basis:0px}.sky-tokens .sky-tokens-content:before{content:\"\\200b\"}\n"] }]
1466
+ ], template: "<div\n class=\"sky-tokens\"\n [@blockAnimationOnLoad]\n [attr.role]=\"tokens.length ? 'list' : null\"\n>\n <sky-token\n *ngFor=\"let token of tokens; let i = index; trackBy: trackTokenFn\"\n role=\"listitem\"\n [@.disabled]=\"!trackWith\"\n [@dismiss]\n [disabled]=\"disabled\"\n [dismissible]=\"dismissible\"\n [focusable]=\"focusable\"\n (dismiss)=\"removeToken(token)\"\n (click)=\"onTokenClick(token)\"\n (keydown)=\"onTokenKeyDown($event)\"\n (keyup.enter)=\"selectToken(token); $event.preventDefault()\"\n (tokenFocus)=\"activeIndex = i\"\n >\n {{ token.value[displayWith] }}\n </sky-token>\n <div class=\"sky-tokens-content\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";.sky-tokens{display:flex;flex-wrap:wrap;align-items:baseline;margin:-2px}.sky-tokens .sky-tokens-content,.sky-tokens ::ng-deep sky-token{flex:0 0 auto;display:inline-flex;padding:2px}.sky-tokens .sky-tokens-content{flex-grow:1;flex-basis:0px}.sky-tokens .sky-tokens-content:before{content:\"\\200b\"}\n"] }]
1462
1467
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { disabled: [{
1463
1468
  type: Input
1464
1469
  }], dismissible: [{
@@ -1513,6 +1518,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
1513
1518
  }]
1514
1519
  }] });
1515
1520
 
1521
+ var _SkyWaitAdapterService_instances, _SkyWaitAdapterService_focusableElements, _SkyWaitAdapterService_renderer, _SkyWaitAdapterService_focusNextElement, _SkyWaitAdapterService_isShift, _SkyWaitAdapterService_isElementHidden, _SkyWaitAdapterService_isElementBusyOrHidden, _SkyWaitAdapterService_clearDocumentFocus, _SkyWaitAdapterService_getFocusableElements, _SkyWaitAdapterService_clearListeners;
1522
+ const busyElements = {};
1516
1523
  // Need to add the following to classes which contain static methods.
1517
1524
  // See: https://github.com/ng-packagr/ng-packagr/issues/641
1518
1525
  /**
@@ -1521,19 +1528,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
1521
1528
  */
1522
1529
  class SkyWaitAdapterService {
1523
1530
  constructor(rendererFactory) {
1524
- this.rendererFactory = rendererFactory;
1525
- this.renderer = this.rendererFactory.createRenderer(undefined, undefined);
1531
+ _SkyWaitAdapterService_instances.add(this);
1532
+ _SkyWaitAdapterService_focusableElements.set(this, void 0);
1533
+ _SkyWaitAdapterService_renderer.set(this, void 0);
1534
+ __classPrivateFieldSet(this, _SkyWaitAdapterService_renderer, rendererFactory.createRenderer(undefined, null), "f");
1526
1535
  }
1527
1536
  ngOnDestroy() {
1528
- this.clearListeners();
1537
+ __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_clearListeners).call(this);
1529
1538
  }
1530
1539
  setWaitBounds(waitEl) {
1531
- this.renderer.setStyle(waitEl.nativeElement.parentElement, 'position', 'relative');
1540
+ __classPrivateFieldGet(this, _SkyWaitAdapterService_renderer, "f").setStyle(waitEl.nativeElement.parentElement, 'position', 'relative');
1532
1541
  }
1533
1542
  removeWaitBounds(waitEl) {
1534
- this.renderer.removeStyle(waitEl.nativeElement.parentElement, 'position');
1543
+ __classPrivateFieldGet(this, _SkyWaitAdapterService_renderer, "f").removeStyle(waitEl.nativeElement.parentElement, 'position');
1535
1544
  }
1536
- setBusyState(waitEl, isFullPage, isWaiting, isNonBlocking = false, waitComponentId) {
1545
+ setBusyState(waitEl, isFullPage, isWaiting, isNonBlocking, waitComponentId) {
1546
+ var _a;
1537
1547
  const busyEl = isFullPage
1538
1548
  ? document.body
1539
1549
  : waitEl.nativeElement.parentElement;
@@ -1541,18 +1551,18 @@ class SkyWaitAdapterService {
1541
1551
  if (isWaiting) {
1542
1552
  let restoreFocusElement = undefined;
1543
1553
  let restoreFocusCheckElement = undefined;
1544
- this.renderer.setAttribute(busyEl, 'aria-busy', 'true');
1554
+ __classPrivateFieldGet(this, _SkyWaitAdapterService_renderer, "f").setAttribute(busyEl, 'aria-busy', 'true');
1545
1555
  // Remove focus from page when full page blocking wait
1546
1556
  if (isFullPage || busyEl.contains(document.activeElement)) {
1547
1557
  if (document.activeElement !== document.body) {
1548
1558
  restoreFocusElement = document.activeElement;
1549
1559
  }
1550
- this.clearDocumentFocus();
1560
+ __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_clearDocumentFocus).call(this);
1551
1561
  restoreFocusCheckElement = document.activeElement;
1552
1562
  }
1553
1563
  if (isFullPage) {
1554
1564
  SkyWaitAdapterService.isPageWaitActive = true;
1555
- const endListenerFunc = this.renderer.listen(document.body, 'keydown', (event) => {
1565
+ const endListenerFunc = __classPrivateFieldGet(this, _SkyWaitAdapterService_renderer, "f").listen(document.body, 'keydown', (event) => {
1556
1566
  /*istanbul ignore else */
1557
1567
  if (event.key) {
1558
1568
  /* istanbul ignore else */
@@ -1561,198 +1571,221 @@ class SkyWaitAdapterService {
1561
1571
  event.preventDefault();
1562
1572
  event.stopPropagation();
1563
1573
  event.stopImmediatePropagation();
1564
- this.clearDocumentFocus();
1574
+ __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_clearDocumentFocus).call(this);
1565
1575
  }
1566
1576
  }
1567
1577
  });
1568
- SkyWaitAdapterService.busyElements[waitComponentId] = {
1569
- listener: endListenerFunc,
1570
- busyEl: undefined,
1571
- restoreFocusElement,
1572
- restoreFocusCheckElement,
1573
- };
1578
+ if (waitComponentId) {
1579
+ busyElements[waitComponentId] = {
1580
+ listener: endListenerFunc,
1581
+ busyEl: undefined,
1582
+ restoreFocusElement,
1583
+ restoreFocusCheckElement,
1584
+ };
1585
+ }
1574
1586
  }
1575
1587
  else {
1576
- const endListenerFunc = this.renderer.listen(busyEl, 'focusin', (event) => {
1588
+ const endListenerFunc = __classPrivateFieldGet(this, _SkyWaitAdapterService_renderer, "f").listen(busyEl, 'focusin', (event) => {
1577
1589
  /* istanbul ignore else */
1578
1590
  if (!isNonBlocking) {
1579
1591
  event.preventDefault();
1580
1592
  event.stopPropagation();
1581
1593
  event.stopImmediatePropagation();
1582
1594
  if (SkyWaitAdapterService.isPageWaitActive) {
1583
- this.clearDocumentFocus();
1595
+ __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_clearDocumentFocus).call(this);
1584
1596
  }
1585
1597
  else {
1586
1598
  // Propagate tab navigation if attempted into waited element
1587
1599
  const target = event.target;
1588
- target.blur();
1589
- this.focusNextElement(target, this.isShift(event), busyEl);
1600
+ if (target) {
1601
+ target.blur();
1602
+ __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_focusNextElement).call(this, target, __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isShift).call(this, event));
1603
+ }
1590
1604
  }
1591
1605
  }
1592
1606
  });
1593
- SkyWaitAdapterService.busyElements[waitComponentId] = {
1594
- listener: endListenerFunc,
1595
- busyEl: busyEl,
1596
- restoreFocusElement,
1597
- restoreFocusCheckElement,
1598
- };
1607
+ if (waitComponentId) {
1608
+ busyElements[waitComponentId] = {
1609
+ listener: endListenerFunc,
1610
+ busyEl,
1611
+ restoreFocusElement,
1612
+ restoreFocusCheckElement,
1613
+ };
1614
+ }
1599
1615
  }
1600
1616
  }
1601
1617
  else {
1602
- this.renderer.removeAttribute(busyEl, 'aria-busy');
1618
+ __classPrivateFieldGet(this, _SkyWaitAdapterService_renderer, "f").removeAttribute(busyEl, 'aria-busy');
1603
1619
  if (isFullPage) {
1604
1620
  SkyWaitAdapterService.isPageWaitActive = false;
1605
1621
  }
1606
- if (waitComponentId in SkyWaitAdapterService.busyElements) {
1607
- SkyWaitAdapterService.busyElements[waitComponentId].listener();
1622
+ if (waitComponentId && waitComponentId in busyElements) {
1623
+ const busyElement = busyElements[waitComponentId];
1624
+ busyElement.listener();
1608
1625
  // If there is a restore focus element and the focus has not moved, restore focus.
1609
- if (SkyWaitAdapterService.busyElements[waitComponentId]
1610
- .restoreFocusElement &&
1611
- SkyWaitAdapterService.busyElements[waitComponentId]
1612
- .restoreFocusCheckElement === document.activeElement) {
1613
- SkyWaitAdapterService.busyElements[waitComponentId].restoreFocusElement.focus();
1626
+ if (busyElement.restoreFocusCheckElement === document.activeElement) {
1627
+ (_a = busyElement.restoreFocusElement) === null || _a === void 0 ? void 0 : _a.focus();
1614
1628
  }
1615
- delete SkyWaitAdapterService.busyElements[waitComponentId];
1629
+ delete busyElements[waitComponentId];
1616
1630
  }
1617
1631
  }
1618
1632
  }
1619
1633
  }
1620
- focusNextElement(targetElement, shiftKey, busyEl) {
1621
- const focussable = this.getFocussableElements();
1622
- // If shift tab, go in the other direction
1623
- const modifier = shiftKey ? -1 : 1;
1624
- // Find the next navigable element that isn't waiting
1625
- const startingIndex = focussable.indexOf(targetElement);
1626
- let curIndex = startingIndex + modifier;
1627
- while (focussable[curIndex] &&
1628
- this.isElementBusyOrHidden(focussable[curIndex])) {
1629
- curIndex += modifier;
1630
- }
1631
- if (focussable[curIndex] &&
1632
- !this.isElementBusyOrHidden(focussable[curIndex])) {
1633
- focussable[curIndex].focus();
1634
- }
1635
- else {
1636
- // Try wrapping the navigation
1634
+ }
1635
+ _SkyWaitAdapterService_focusableElements = new WeakMap(), _SkyWaitAdapterService_renderer = new WeakMap(), _SkyWaitAdapterService_instances = new WeakSet(), _SkyWaitAdapterService_focusNextElement = function _SkyWaitAdapterService_focusNextElement(targetElement, shiftKey) {
1636
+ const focusable = __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_getFocusableElements).call(this);
1637
+ // If shift tab, go in the other direction
1638
+ const modifier = shiftKey ? -1 : 1;
1639
+ // Find the next navigable element that isn't waiting
1640
+ const startingIndex = focusable.indexOf(targetElement);
1641
+ let curIndex = startingIndex + modifier;
1642
+ while (focusable[curIndex] &&
1643
+ __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isElementBusyOrHidden).call(this, focusable[curIndex])) {
1644
+ curIndex += modifier;
1645
+ }
1646
+ if (focusable[curIndex] &&
1647
+ !__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isElementBusyOrHidden).call(this, focusable[curIndex])) {
1648
+ focusable[curIndex].focus();
1649
+ }
1650
+ else {
1651
+ // Try wrapping the navigation
1652
+ /* istanbul ignore next */
1653
+ /* sanity check */
1654
+ curIndex = modifier > 0 ? 0 : focusable.length - 1;
1655
+ while (curIndex !== startingIndex &&
1656
+ focusable[curIndex] &&
1657
+ __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isElementBusyOrHidden).call(this, focusable[curIndex])) {
1637
1658
  /* istanbul ignore next */
1638
1659
  /* sanity check */
1639
- curIndex = modifier > 0 ? 0 : focussable.length - 1;
1640
- while (curIndex !== startingIndex &&
1641
- focussable[curIndex] &&
1642
- this.isElementBusyOrHidden(focussable[curIndex])) {
1643
- /* istanbul ignore next */
1644
- /* sanity check */
1645
- curIndex += modifier;
1646
- }
1647
- /* istanbul ignore else */
1648
- /* sanity check */
1649
- if (focussable[curIndex] &&
1650
- !this.isElementBusyOrHidden(focussable[curIndex])) {
1651
- focussable[curIndex].focus();
1652
- }
1653
- else {
1654
- // No valid target, wipe focus
1655
- this.clearDocumentFocus();
1656
- }
1657
- }
1658
- // clear focussableElements list
1659
- this.focussableElements = undefined;
1660
- }
1661
- isShift(event) {
1662
- // Determine if shift+tab was used based on element order
1663
- const elements = this.getFocussableElements().filter((elem) => !this.isElementHidden(elem));
1664
- const previousInd = elements.indexOf(event.relatedTarget);
1665
- const currentInd = elements.indexOf(event.target);
1666
- return (previousInd === currentInd + 1 ||
1667
- (previousInd === 0 && currentInd === elements.length - 1) ||
1668
- previousInd > currentInd ||
1669
- !event.relatedTarget);
1670
- }
1671
- isElementHidden(element) {
1672
- const style = window.getComputedStyle(element);
1673
- return style.display === 'none' || style.visibility === 'hidden';
1674
- }
1675
- isElementBusyOrHidden(element) {
1676
- if (this.isElementHidden(element)) {
1677
- return true;
1678
- }
1679
- for (const key of Object.keys(SkyWaitAdapterService.busyElements)) {
1680
- const parentElement = SkyWaitAdapterService.busyElements[key].busyEl;
1681
- if (parentElement && parentElement.contains(element)) {
1682
- return true;
1683
- }
1660
+ curIndex += modifier;
1684
1661
  }
1685
- return false;
1686
- }
1687
- clearDocumentFocus() {
1688
1662
  /* istanbul ignore else */
1689
- if (document.activeElement && document.activeElement.blur) {
1690
- document.activeElement.blur();
1663
+ /* sanity check */
1664
+ if (focusable[curIndex] &&
1665
+ !__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isElementBusyOrHidden).call(this, focusable[curIndex])) {
1666
+ focusable[curIndex].focus();
1691
1667
  }
1692
- document.body.focus();
1693
- }
1694
- getFocussableElements() {
1695
- // Keep this cached so we can reduce querys
1696
- if (this.focussableElements) {
1697
- return this.focussableElements;
1668
+ else {
1669
+ // No valid target, wipe focus
1670
+ __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_clearDocumentFocus).call(this);
1698
1671
  }
1699
- // Select all possible focussable elements
1700
- const focussableElements = 'a[href], ' +
1701
- 'area[href], ' +
1702
- "input:not([disabled]):not([tabindex='-1']), " +
1703
- "button:not([disabled]):not([tabindex='-1']), " +
1704
- "select:not([disabled]):not([tabindex='-1']), " +
1705
- "textarea:not([disabled]):not([tabindex='-1']), " +
1706
- 'iframe, object, embed, ' +
1707
- "*[tabindex]:not([tabindex='-1']), " +
1708
- '*[contenteditable=true]';
1709
- this.focussableElements = Array.prototype.filter.call(document.body.querySelectorAll(focussableElements), (element) => {
1710
- return (element.offsetWidth > 0 ||
1711
- element.offsetHeight > 0 ||
1712
- element === document.activeElement);
1713
- });
1714
- return this.focussableElements;
1715
1672
  }
1716
- clearListeners() {
1717
- SkyWaitAdapterService.isPageWaitActive = false;
1718
- for (const key of Object.keys(SkyWaitAdapterService.busyElements)) {
1719
- SkyWaitAdapterService.busyElements[key].listener();
1720
- delete SkyWaitAdapterService.busyElements[key];
1673
+ // clear focusableElements list
1674
+ __classPrivateFieldSet(this, _SkyWaitAdapterService_focusableElements, undefined, "f");
1675
+ }, _SkyWaitAdapterService_isShift = function _SkyWaitAdapterService_isShift(event) {
1676
+ // Determine if shift+tab was used based on element order
1677
+ const elements = __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_getFocusableElements).call(this).filter((elem) => !__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isElementHidden).call(this, elem));
1678
+ const previousInd = elements.indexOf(event.relatedTarget);
1679
+ const currentInd = elements.indexOf(event.target);
1680
+ return (previousInd === currentInd + 1 ||
1681
+ (previousInd === 0 && currentInd === elements.length - 1) ||
1682
+ previousInd > currentInd ||
1683
+ !event.relatedTarget);
1684
+ }, _SkyWaitAdapterService_isElementHidden = function _SkyWaitAdapterService_isElementHidden(element) {
1685
+ const style = window.getComputedStyle(element);
1686
+ return style.display === 'none' || style.visibility === 'hidden';
1687
+ }, _SkyWaitAdapterService_isElementBusyOrHidden = function _SkyWaitAdapterService_isElementBusyOrHidden(element) {
1688
+ if (__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isElementHidden).call(this, element)) {
1689
+ return true;
1690
+ }
1691
+ for (const key of Object.keys(busyElements)) {
1692
+ const parentElement = busyElements[key].busyEl;
1693
+ if (parentElement && parentElement.contains(element)) {
1694
+ return true;
1721
1695
  }
1722
1696
  }
1723
- }
1697
+ return false;
1698
+ }, _SkyWaitAdapterService_clearDocumentFocus = function _SkyWaitAdapterService_clearDocumentFocus() {
1699
+ const activeElement = document.activeElement;
1700
+ /* istanbul ignore else */
1701
+ if (activeElement) {
1702
+ activeElement.blur();
1703
+ }
1704
+ document.body.focus();
1705
+ }, _SkyWaitAdapterService_getFocusableElements = function _SkyWaitAdapterService_getFocusableElements() {
1706
+ // Keep this cached so we can reduce queries
1707
+ if (__classPrivateFieldGet(this, _SkyWaitAdapterService_focusableElements, "f")) {
1708
+ return __classPrivateFieldGet(this, _SkyWaitAdapterService_focusableElements, "f");
1709
+ }
1710
+ // Select all possible focusable elements
1711
+ const focusableElements = 'a[href], ' +
1712
+ 'area[href], ' +
1713
+ "input:not([disabled]):not([tabindex='-1']), " +
1714
+ "button:not([disabled]):not([tabindex='-1']), " +
1715
+ "select:not([disabled]):not([tabindex='-1']), " +
1716
+ "textarea:not([disabled]):not([tabindex='-1']), " +
1717
+ 'iframe, object, embed, ' +
1718
+ "*[tabindex]:not([tabindex='-1']), " +
1719
+ '*[contenteditable=true]';
1720
+ __classPrivateFieldSet(this, _SkyWaitAdapterService_focusableElements, Array.prototype.filter.call(document.body.querySelectorAll(focusableElements), (element) => {
1721
+ return (element.offsetWidth > 0 ||
1722
+ element.offsetHeight > 0 ||
1723
+ element === document.activeElement);
1724
+ }), "f");
1725
+ return __classPrivateFieldGet(this, _SkyWaitAdapterService_focusableElements, "f");
1726
+ }, _SkyWaitAdapterService_clearListeners = function _SkyWaitAdapterService_clearListeners() {
1727
+ SkyWaitAdapterService.isPageWaitActive = false;
1728
+ for (const key of Object.keys(busyElements)) {
1729
+ busyElements[key].listener();
1730
+ delete busyElements[key];
1731
+ }
1732
+ };
1724
1733
  SkyWaitAdapterService.isPageWaitActive = false;
1725
- SkyWaitAdapterService.busyElements = {};
1726
1734
  SkyWaitAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitAdapterService, deps: [{ token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
1727
1735
  SkyWaitAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitAdapterService });
1728
1736
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitAdapterService, decorators: [{
1729
1737
  type: Injectable
1730
1738
  }], ctorParameters: function () { return [{ type: i0.RendererFactory2 }]; } });
1731
1739
 
1740
+ var _SkyWaitComponent_instances, _SkyWaitComponent_elRef, _SkyWaitComponent_adapterService, _SkyWaitComponent_resourceSvc, _SkyWaitComponent_ngUnsubscribe, _SkyWaitComponent_id, _SkyWaitComponent_customAriaLabel, _SkyWaitComponent__isFullPage, _SkyWaitComponent__isNonBlocking, _SkyWaitComponent__isWaiting, _SkyWaitComponent_publishAriaLabel;
1732
1741
  let nextId = 0;
1733
1742
  class SkyWaitComponent {
1734
- constructor(elRef, adapterService, resourceService) {
1735
- this.elRef = elRef;
1736
- this.adapterService = adapterService;
1737
- this.resourceService = resourceService;
1743
+ constructor(elRef, adapterService, resourceSvc) {
1744
+ _SkyWaitComponent_instances.add(this);
1738
1745
  this.ariaLabelStream = new BehaviorSubject('');
1739
- this.id = `sky-wait-${++nextId}`;
1746
+ _SkyWaitComponent_elRef.set(this, void 0);
1747
+ _SkyWaitComponent_adapterService.set(this, void 0);
1748
+ _SkyWaitComponent_resourceSvc.set(this, void 0);
1749
+ _SkyWaitComponent_ngUnsubscribe.set(this, new Subject());
1750
+ _SkyWaitComponent_id.set(this, void 0);
1751
+ _SkyWaitComponent_customAriaLabel.set(this, void 0);
1752
+ _SkyWaitComponent__isFullPage.set(this, void 0);
1753
+ _SkyWaitComponent__isNonBlocking.set(this, void 0);
1754
+ _SkyWaitComponent__isWaiting.set(this, void 0);
1755
+ __classPrivateFieldSet(this, _SkyWaitComponent_elRef, elRef, "f");
1756
+ __classPrivateFieldSet(this, _SkyWaitComponent_adapterService, adapterService, "f");
1757
+ __classPrivateFieldSet(this, _SkyWaitComponent_resourceSvc, resourceSvc, "f");
1758
+ __classPrivateFieldSet(this, _SkyWaitComponent_id, `sky-wait-${++nextId}`, "f");
1759
+ }
1760
+ /**
1761
+ * Specifies an ARIA label for the wait icon while an element or page loads.
1762
+ * This sets the icon's `aria-label` attribute
1763
+ * [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).
1764
+ * The default value varies based on whether the wait is for an element or a page
1765
+ * and whether it is a blocking wait. For example, the default for a page-blocking
1766
+ * wait is "Page loading. Please wait."
1767
+ */
1768
+ set ariaLabel(value) {
1769
+ __classPrivateFieldSet(this, _SkyWaitComponent_customAriaLabel, value, "f");
1770
+ __classPrivateFieldGet(this, _SkyWaitComponent_instances, "m", _SkyWaitComponent_publishAriaLabel).call(this);
1740
1771
  }
1741
1772
  /**
1742
1773
  * When set to `true`, wait indication appears on the parent element of the `sky-wait` component.
1743
1774
  */
1744
1775
  set isWaiting(value) {
1745
- if (value && !this._isFullPage) {
1746
- this.adapterService.setWaitBounds(this.elRef);
1747
- }
1748
- else if (!value && !this._isFullPage) {
1749
- this.adapterService.removeWaitBounds(this.elRef);
1776
+ if (!this.isFullPage) {
1777
+ if (value) {
1778
+ __classPrivateFieldGet(this, _SkyWaitComponent_adapterService, "f").setWaitBounds(__classPrivateFieldGet(this, _SkyWaitComponent_elRef, "f"));
1779
+ }
1780
+ else {
1781
+ __classPrivateFieldGet(this, _SkyWaitComponent_adapterService, "f").removeWaitBounds(__classPrivateFieldGet(this, _SkyWaitComponent_elRef, "f"));
1782
+ }
1750
1783
  }
1751
- this.adapterService.setBusyState(this.elRef, this.isFullPage, value, this.isNonBlocking, this.id);
1752
- this._isWaiting = value;
1784
+ __classPrivateFieldGet(this, _SkyWaitComponent_adapterService, "f").setBusyState(__classPrivateFieldGet(this, _SkyWaitComponent_elRef, "f"), !!this.isFullPage, !!value, !!this.isNonBlocking, __classPrivateFieldGet(this, _SkyWaitComponent_id, "f"));
1785
+ __classPrivateFieldSet(this, _SkyWaitComponent__isWaiting, value, "f");
1753
1786
  }
1754
1787
  get isWaiting() {
1755
- return this._isWaiting;
1788
+ return __classPrivateFieldGet(this, _SkyWaitComponent__isWaiting, "f");
1756
1789
  }
1757
1790
  /**
1758
1791
  * When set to `true`, wait indication appears on the page level instead of the
@@ -1764,35 +1797,55 @@ class SkyWaitComponent {
1764
1797
  set isFullPage(value) {
1765
1798
  /* istanbul ignore else: untestable */
1766
1799
  if (value) {
1767
- this.adapterService.removeWaitBounds(this.elRef);
1800
+ __classPrivateFieldGet(this, _SkyWaitComponent_adapterService, "f").removeWaitBounds(__classPrivateFieldGet(this, _SkyWaitComponent_elRef, "f"));
1768
1801
  }
1769
- else if (!value && this._isWaiting) {
1770
- this.adapterService.setWaitBounds(this.elRef);
1802
+ else if (this.isWaiting) {
1803
+ __classPrivateFieldGet(this, _SkyWaitComponent_adapterService, "f").setWaitBounds(__classPrivateFieldGet(this, _SkyWaitComponent_elRef, "f"));
1771
1804
  }
1772
- this._isFullPage = value;
1805
+ __classPrivateFieldSet(this, _SkyWaitComponent__isFullPage, value, "f");
1806
+ __classPrivateFieldGet(this, _SkyWaitComponent_instances, "m", _SkyWaitComponent_publishAriaLabel).call(this);
1773
1807
  }
1774
1808
  get isFullPage() {
1775
- return this._isFullPage;
1809
+ return __classPrivateFieldGet(this, _SkyWaitComponent__isFullPage, "f");
1810
+ }
1811
+ /**
1812
+ * When set to `true`, wait indication appears in the bottom left corner of the element
1813
+ * instead of hiding the entire parent element.
1814
+ * @default false
1815
+ */
1816
+ set isNonBlocking(value) {
1817
+ __classPrivateFieldSet(this, _SkyWaitComponent__isNonBlocking, value, "f");
1818
+ __classPrivateFieldGet(this, _SkyWaitComponent_instances, "m", _SkyWaitComponent_publishAriaLabel).call(this);
1819
+ }
1820
+ get isNonBlocking() {
1821
+ return __classPrivateFieldGet(this, _SkyWaitComponent__isNonBlocking, "f");
1776
1822
  }
1777
1823
  ngOnInit() {
1778
- this.publishAriaLabel();
1824
+ __classPrivateFieldGet(this, _SkyWaitComponent_instances, "m", _SkyWaitComponent_publishAriaLabel).call(this);
1779
1825
  }
1780
- publishAriaLabel() {
1781
- if (this.ariaLabel) {
1782
- this.ariaLabelStream.next(this.ariaLabel);
1783
- return;
1784
- }
1785
- /* istanbul ignore else */
1786
- if (this.resourceService) {
1787
- const type = this.isFullPage ? '_page' : '';
1788
- const blocking = this.isNonBlocking ? '' : '_blocking';
1789
- const key = `skyux_wait${type}${blocking}_aria_alt_text`;
1790
- this.resourceService.getString(key).subscribe((value) => {
1791
- this.ariaLabelStream.next(value);
1792
- });
1793
- }
1826
+ ngOnDestroy() {
1827
+ __classPrivateFieldGet(this, _SkyWaitComponent_ngUnsubscribe, "f").next();
1828
+ __classPrivateFieldGet(this, _SkyWaitComponent_ngUnsubscribe, "f").complete();
1794
1829
  }
1795
1830
  }
1831
+ _SkyWaitComponent_elRef = new WeakMap(), _SkyWaitComponent_adapterService = new WeakMap(), _SkyWaitComponent_resourceSvc = new WeakMap(), _SkyWaitComponent_ngUnsubscribe = new WeakMap(), _SkyWaitComponent_id = new WeakMap(), _SkyWaitComponent_customAriaLabel = new WeakMap(), _SkyWaitComponent__isFullPage = new WeakMap(), _SkyWaitComponent__isNonBlocking = new WeakMap(), _SkyWaitComponent__isWaiting = new WeakMap(), _SkyWaitComponent_instances = new WeakSet(), _SkyWaitComponent_publishAriaLabel = function _SkyWaitComponent_publishAriaLabel() {
1832
+ if (__classPrivateFieldGet(this, _SkyWaitComponent_customAriaLabel, "f")) {
1833
+ this.ariaLabelStream.next(__classPrivateFieldGet(this, _SkyWaitComponent_customAriaLabel, "f"));
1834
+ return;
1835
+ }
1836
+ /* istanbul ignore else */
1837
+ if (__classPrivateFieldGet(this, _SkyWaitComponent_resourceSvc, "f")) {
1838
+ const type = this.isFullPage ? '_page' : '';
1839
+ const blocking = this.isNonBlocking ? '' : '_blocking';
1840
+ const key = `skyux_wait${type}${blocking}_aria_alt_text`;
1841
+ __classPrivateFieldGet(this, _SkyWaitComponent_resourceSvc, "f")
1842
+ .getString(key)
1843
+ .pipe(take(1), takeUntil(__classPrivateFieldGet(this, _SkyWaitComponent_ngUnsubscribe, "f")))
1844
+ .subscribe((value) => {
1845
+ this.ariaLabelStream.next(value);
1846
+ });
1847
+ }
1848
+ };
1796
1849
  SkyWaitComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitComponent, deps: [{ token: i0.ElementRef }, { token: SkyWaitAdapterService }, { token: i1$2.SkyLibResourcesService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1797
1850
  SkyWaitComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyWaitComponent, selector: "sky-wait", inputs: { ariaLabel: "ariaLabel", isWaiting: "isWaiting", isFullPage: "isFullPage", isNonBlocking: "isNonBlocking" }, providers: [SkyWaitAdapterService], ngImport: i0, template: "<div class=\"sky-wait-container\">\n <div\n *ngIf=\"isWaiting\"\n class=\"sky-wait-mask\"\n [attr.aria-label]=\"ariaLabelStream | async\"\n [ngClass]=\"{\n 'sky-wait-mask-loading-fixed': isFullPage,\n 'sky-wait-mask-loading-non-blocking': isNonBlocking,\n 'sky-wait-mask-loading-blocking': !isNonBlocking\n }\"\n >\n <div class=\"sky-wait\">\n <div class=\"sky-wait-double-bounce1\"></div>\n <div class=\"sky-wait-double-bounce2\"></div>\n </div>\n </div>\n</div>\n", styles: [".sky-wait-mask-loading-blocking{margin:auto;position:absolute;top:0;right:0;left:0;bottom:0;background-color:#ffffffb3;z-index:1000}.sky-wait-mask-loading-fixed{position:fixed}.sky-wait{width:50px;height:50px;margin-top:-25px;margin-left:-25px;position:absolute;top:50%;left:50%}.sky-wait-mask-loading-non-blocking{bottom:0}.sky-wait-mask-loading-non-blocking .sky-wait{top:auto;right:auto;bottom:0;left:0;margin-left:auto;margin-right:auto}.sky-wait-double-bounce1,.sky-wait-double-bounce2{width:100%;height:100%;border-radius:50%;background-color:#72bf44;opacity:.6;position:absolute;top:0;left:0;animation:sk-bounce 2s infinite ease-in-out}.sky-wait-double-bounce2{animation-delay:-1s}@keyframes sk-bounce{0%,to{transform:scale(0);-webkit-transform:scale(0)}50%{transform:scale(1);-webkit-transform:scale(1)}}.sky-wait-container.sky-wait-active{position:relative}\n"], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i1$1.AsyncPipe } });
1798
1851
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitComponent, decorators: [{
@@ -1865,58 +1918,67 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
1865
1918
  }]
1866
1919
  }] });
1867
1920
 
1921
+ var _SkyWaitService_instances, _SkyWaitService_resolver, _SkyWaitService_appRef, _SkyWaitService_waitAdapter, _SkyWaitService_windowSvc, _SkyWaitService_setWaitComponentProperties, _SkyWaitService_beginPageWait, _SkyWaitService_endPageWait, _SkyWaitService_clearPageWait;
1922
+ let waitComponent;
1923
+ let pageWaitBlockingCount = 0;
1924
+ let pageWaitNonBlockingCount = 0;
1868
1925
  // Need to add the following to classes which contain static methods.
1869
1926
  // See: https://github.com/ng-packagr/ng-packagr/issues/641
1870
1927
  // @dynamic
1871
1928
  class SkyWaitService {
1872
1929
  constructor(resolver, appRef, waitAdapter, windowSvc) {
1873
- this.resolver = resolver;
1874
- this.appRef = appRef;
1875
- this.waitAdapter = waitAdapter;
1876
- this.windowSvc = windowSvc;
1930
+ _SkyWaitService_instances.add(this);
1931
+ _SkyWaitService_resolver.set(this, void 0);
1932
+ _SkyWaitService_appRef.set(this, void 0);
1933
+ _SkyWaitService_waitAdapter.set(this, void 0);
1934
+ _SkyWaitService_windowSvc.set(this, void 0);
1935
+ __classPrivateFieldSet(this, _SkyWaitService_resolver, resolver, "f");
1936
+ __classPrivateFieldSet(this, _SkyWaitService_appRef, appRef, "f");
1937
+ __classPrivateFieldSet(this, _SkyWaitService_waitAdapter, waitAdapter, "f");
1938
+ __classPrivateFieldSet(this, _SkyWaitService_windowSvc, windowSvc, "f");
1877
1939
  }
1878
1940
  /**
1879
1941
  * Starts a blocking page wait on the page.
1880
1942
  */
1881
1943
  beginBlockingPageWait() {
1882
- this.beginPageWait(true);
1944
+ __classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_beginPageWait).call(this, true);
1883
1945
  }
1884
1946
  /**
1885
1947
  * Starts a non-blocking page wait on the page.
1886
1948
  */
1887
1949
  beginNonBlockingPageWait() {
1888
- this.beginPageWait(false);
1950
+ __classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_beginPageWait).call(this, false);
1889
1951
  }
1890
1952
  /**
1891
1953
  * Ends a blocking page wait on the page. Blocking page wait indication
1892
1954
  * is removed when all running blocking page waits are ended.
1893
1955
  */
1894
1956
  endBlockingPageWait() {
1895
- this.endPageWait(true);
1957
+ __classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_endPageWait).call(this, true);
1896
1958
  }
1897
1959
  /**
1898
1960
  * Ends a non-blocking page wait on the page. Non-blocking page wait indication
1899
1961
  * is removed when all running non-blocking page waits are ended.
1900
1962
  */
1901
1963
  endNonBlockingPageWait() {
1902
- this.endPageWait(false);
1964
+ __classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_endPageWait).call(this, false);
1903
1965
  }
1904
1966
  /**
1905
1967
  * Clears all blocking and non-blocking page waits on the page.
1906
1968
  */
1907
1969
  clearAllPageWaits() {
1908
- this.clearPageWait(true);
1909
- this.clearPageWait(false);
1970
+ __classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_clearPageWait).call(this, true);
1971
+ __classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_clearPageWait).call(this, false);
1910
1972
  }
1911
1973
  /**
1912
1974
  * @internal
1913
1975
  */
1914
1976
  dispose() {
1915
- if (SkyWaitService.waitComponent) {
1916
- SkyWaitService.waitComponent = undefined;
1917
- SkyWaitService.pageWaitBlockingCount = 0;
1918
- SkyWaitService.pageWaitNonBlockingCount = 0;
1919
- this.waitAdapter.removePageWaitEl();
1977
+ if (waitComponent) {
1978
+ waitComponent = undefined;
1979
+ pageWaitBlockingCount = 0;
1980
+ pageWaitNonBlockingCount = 0;
1981
+ __classPrivateFieldGet(this, _SkyWaitService_waitAdapter, "f").removePageWaitEl();
1920
1982
  }
1921
1983
  }
1922
1984
  /**
@@ -1938,79 +2000,76 @@ class SkyWaitService {
1938
2000
  return observable.pipe(finalize(() => this.endNonBlockingPageWait()));
1939
2001
  });
1940
2002
  }
1941
- setWaitComponentProperties(isBlocking) {
2003
+ }
2004
+ _SkyWaitService_resolver = new WeakMap(), _SkyWaitService_appRef = new WeakMap(), _SkyWaitService_waitAdapter = new WeakMap(), _SkyWaitService_windowSvc = new WeakMap(), _SkyWaitService_instances = new WeakSet(), _SkyWaitService_setWaitComponentProperties = function _SkyWaitService_setWaitComponentProperties(isBlocking) {
2005
+ if (waitComponent) {
1942
2006
  if (isBlocking) {
1943
- SkyWaitService.waitComponent.hasBlockingWait = true;
1944
- SkyWaitService.pageWaitBlockingCount++;
1945
- }
1946
- else {
1947
- SkyWaitService.waitComponent.hasNonBlockingWait = true;
1948
- SkyWaitService.pageWaitNonBlockingCount++;
1949
- }
1950
- }
1951
- beginPageWait(isBlocking) {
1952
- if (!SkyWaitService.waitComponent) {
1953
- /*
1954
- Dynamic component creation needs to be done in a timeout to prevent ApplicationRef from
1955
- crashing when wait service is called in Angular lifecycle functions.
1956
- */
1957
- this.windowSvc.nativeWindow.setTimeout(() => {
1958
- // Ensuring here that we recheck this after the setTimeout is over so that we don't clash
1959
- // with any other waits that are created.
1960
- if (!SkyWaitService.waitComponent) {
1961
- const factory = this.resolver.resolveComponentFactory(SkyWaitPageComponent);
1962
- this.waitAdapter.addPageWaitEl();
1963
- const cmpRef = this.appRef.bootstrap(factory);
1964
- SkyWaitService.waitComponent = cmpRef.instance;
1965
- }
1966
- this.setWaitComponentProperties(isBlocking);
1967
- });
2007
+ waitComponent.hasBlockingWait = true;
2008
+ pageWaitBlockingCount++;
1968
2009
  }
1969
2010
  else {
1970
- this.setWaitComponentProperties(isBlocking);
2011
+ waitComponent.hasNonBlockingWait = true;
2012
+ pageWaitNonBlockingCount++;
1971
2013
  }
1972
2014
  }
1973
- endPageWait(isBlocking) {
2015
+ }, _SkyWaitService_beginPageWait = function _SkyWaitService_beginPageWait(isBlocking) {
2016
+ if (!waitComponent) {
1974
2017
  /*
1975
- Needs to yield so that wait creation can finish
1976
- before it is dismissed in the event of a race.
2018
+ Dynamic component creation needs to be done in a timeout to prevent ApplicationRef from
2019
+ crashing when wait service is called in Angular lifecycle functions.
1977
2020
  */
1978
- this.windowSvc.nativeWindow.setTimeout(() => {
1979
- if (SkyWaitService.waitComponent) {
1980
- if (isBlocking) {
1981
- if (SkyWaitService.pageWaitBlockingCount > 0) {
1982
- SkyWaitService.pageWaitBlockingCount--;
1983
- }
1984
- if (SkyWaitService.pageWaitBlockingCount < 1) {
1985
- SkyWaitService.waitComponent.hasBlockingWait = false;
1986
- }
1987
- }
1988
- else {
1989
- if (SkyWaitService.pageWaitNonBlockingCount > 0) {
1990
- SkyWaitService.pageWaitNonBlockingCount--;
1991
- }
1992
- if (SkyWaitService.pageWaitNonBlockingCount < 1) {
1993
- SkyWaitService.waitComponent.hasNonBlockingWait = false;
1994
- }
1995
- }
2021
+ __classPrivateFieldGet(this, _SkyWaitService_windowSvc, "f").nativeWindow.setTimeout(() => {
2022
+ // Ensuring here that we recheck this after the setTimeout is over so that we don't clash
2023
+ // with any other waits that are created.
2024
+ if (!waitComponent) {
2025
+ const factory = __classPrivateFieldGet(this, _SkyWaitService_resolver, "f").resolveComponentFactory(SkyWaitPageComponent);
2026
+ __classPrivateFieldGet(this, _SkyWaitService_waitAdapter, "f").addPageWaitEl();
2027
+ const cmpRef = __classPrivateFieldGet(this, _SkyWaitService_appRef, "f").bootstrap(factory);
2028
+ waitComponent = cmpRef.instance;
1996
2029
  }
2030
+ __classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_setWaitComponentProperties).call(this, isBlocking);
1997
2031
  });
1998
2032
  }
1999
- clearPageWait(isBlocking) {
2000
- if (SkyWaitService.waitComponent) {
2033
+ else {
2034
+ __classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_setWaitComponentProperties).call(this, isBlocking);
2035
+ }
2036
+ }, _SkyWaitService_endPageWait = function _SkyWaitService_endPageWait(isBlocking) {
2037
+ /*
2038
+ Needs to yield so that wait creation can finish
2039
+ before it is dismissed in the event of a race.
2040
+ */
2041
+ __classPrivateFieldGet(this, _SkyWaitService_windowSvc, "f").nativeWindow.setTimeout(() => {
2042
+ if (waitComponent) {
2001
2043
  if (isBlocking) {
2002
- SkyWaitService.pageWaitBlockingCount = 0;
2003
- SkyWaitService.waitComponent.hasBlockingWait = false;
2044
+ if (pageWaitBlockingCount > 0) {
2045
+ pageWaitBlockingCount--;
2046
+ }
2047
+ if (pageWaitBlockingCount < 1) {
2048
+ waitComponent.hasBlockingWait = false;
2049
+ }
2004
2050
  }
2005
2051
  else {
2006
- SkyWaitService.pageWaitNonBlockingCount = 0;
2007
- SkyWaitService.waitComponent.hasNonBlockingWait = false;
2052
+ if (pageWaitNonBlockingCount > 0) {
2053
+ pageWaitNonBlockingCount--;
2054
+ }
2055
+ if (pageWaitNonBlockingCount < 1) {
2056
+ waitComponent.hasNonBlockingWait = false;
2057
+ }
2008
2058
  }
2009
2059
  }
2060
+ });
2061
+ }, _SkyWaitService_clearPageWait = function _SkyWaitService_clearPageWait(isBlocking) {
2062
+ if (waitComponent) {
2063
+ if (isBlocking) {
2064
+ pageWaitBlockingCount = 0;
2065
+ waitComponent.hasBlockingWait = false;
2066
+ }
2067
+ else {
2068
+ pageWaitNonBlockingCount = 0;
2069
+ waitComponent.hasNonBlockingWait = false;
2070
+ }
2010
2071
  }
2011
- }
2012
- SkyWaitService.pageWaitBlockingCount = 0;
2013
- SkyWaitService.pageWaitNonBlockingCount = 0;
2072
+ };
2014
2073
  SkyWaitService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitService, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.ApplicationRef }, { token: SkyWaitPageAdapterService }, { token: i2.SkyAppWindowRef }], target: i0.ɵɵFactoryTarget.Injectable });
2015
2074
  SkyWaitService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitService, providedIn: 'root' });
2016
2075
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitService, decorators: [{