@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.
- package/documentation.json +1229 -413
- package/esm2020/index.mjs +2 -1
- package/esm2020/lib/modules/icon/icon-stack.component.mjs +1 -1
- package/esm2020/lib/modules/icon/icon.component.mjs +1 -10
- package/esm2020/lib/modules/key-info/key-info-layout-type.mjs +2 -0
- package/esm2020/lib/modules/key-info/key-info.component.mjs +1 -1
- package/esm2020/lib/modules/status-indicator/status-indicator.component.mjs +6 -6
- package/esm2020/lib/modules/tokens/token.component.mjs +31 -29
- package/esm2020/lib/modules/tokens/tokens.component.mjs +100 -86
- package/esm2020/lib/modules/wait/wait-adapter.service.mjs +131 -128
- package/esm2020/lib/modules/wait/wait-page.component.mjs +1 -1
- package/esm2020/lib/modules/wait/wait.component.mjs +83 -36
- package/esm2020/lib/modules/wait/wait.service.mjs +80 -73
- package/esm2020/testing/alert/alert-harness-filters.mjs +1 -1
- package/esm2020/testing/alert/alert-harness.mjs +53 -8
- package/esm2020/testing/key-info/key-info-harness-filters.mjs +2 -0
- package/esm2020/testing/key-info/key-info-harness.mjs +50 -0
- package/esm2020/testing/key-info/key-info-label-harness.mjs +18 -0
- package/esm2020/testing/key-info/key-info-value-harness.mjs +18 -0
- package/esm2020/testing/label/label-harness-filters.mjs +2 -0
- package/esm2020/testing/label/label-harness.mjs +96 -0
- package/esm2020/testing/public-api.mjs +7 -3
- package/esm2020/testing/tokens/token-harness.mjs +6 -3
- package/esm2020/testing/tokens/tokens-harness.mjs +4 -1
- package/esm2020/testing/wait-fixture.mjs +1 -1
- package/fesm2015/skyux-indicators-testing.mjs +332 -85
- package/fesm2015/skyux-indicators-testing.mjs.map +1 -1
- package/fesm2015/skyux-indicators.mjs +423 -364
- package/fesm2015/skyux-indicators.mjs.map +1 -1
- package/fesm2020/skyux-indicators-testing.mjs +300 -75
- package/fesm2020/skyux-indicators-testing.mjs.map +1 -1
- package/fesm2020/skyux-indicators.mjs +422 -364
- package/fesm2020/skyux-indicators.mjs.map +1 -1
- package/index.d.ts +1 -0
- package/lib/modules/icon/icon-stack.component.d.ts +1 -1
- package/lib/modules/icon/icon.component.d.ts +4 -4
- package/lib/modules/key-info/key-info-layout-type.d.ts +1 -0
- package/lib/modules/key-info/key-info.component.d.ts +2 -1
- package/lib/modules/status-indicator/status-indicator.component.d.ts +8 -8
- package/lib/modules/tokens/token.component.d.ts +10 -27
- package/lib/modules/tokens/tokens.component.d.ts +17 -34
- package/lib/modules/wait/wait-adapter.service.d.ts +3 -13
- package/lib/modules/wait/wait-page.component.d.ts +2 -2
- package/lib/modules/wait/wait.component.d.ts +12 -16
- package/lib/modules/wait/wait.service.d.ts +1 -11
- package/package.json +5 -5
- package/testing/alert/alert-harness-filters.d.ts +0 -1
- package/testing/alert/alert-harness.d.ts +12 -2
- package/testing/key-info/key-info-harness-filters.d.ts +7 -0
- package/testing/key-info/key-info-harness.d.ts +32 -0
- package/testing/key-info/key-info-label-harness.d.ts +15 -0
- package/testing/key-info/key-info-value-harness.d.ts +15 -0
- package/testing/label/label-harness-filters.d.ts +7 -0
- package/testing/label/label-harness.d.ts +36 -0
- package/testing/public-api.d.ts +6 -2
- package/testing/tokens/token-harness.d.ts +3 -0
- package/testing/tokens/tokens-harness.d.ts +3 -0
- 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,
|
|
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
|
-
|
|
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,
|
|
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(),
|
|
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,
|
|
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,
|
|
1079
|
-
this
|
|
1080
|
-
this.resourcesService = resourcesService;
|
|
1070
|
+
constructor(elementRef, resourcesSvc) {
|
|
1071
|
+
_SkyTokenComponent_instances.add(this);
|
|
1081
1072
|
/**
|
|
1082
|
-
* Fires when users click the close button
|
|
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
|
|
1096
|
+
* @default false
|
|
1095
1097
|
*/
|
|
1096
1098
|
set disabled(value) {
|
|
1097
|
-
this
|
|
1099
|
+
__classPrivateFieldSet(this, _SkyTokenComponent__disabled, !!value, "f");
|
|
1098
1100
|
}
|
|
1099
1101
|
get disabled() {
|
|
1100
|
-
return
|
|
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
|
|
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
|
|
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
|
|
1120
|
+
__classPrivateFieldSet(this, _SkyTokenComponent__dismissible, value !== false, "f");
|
|
1120
1121
|
}
|
|
1121
1122
|
get dismissible() {
|
|
1122
|
-
return this
|
|
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.
|
|
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.
|
|
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
|
|
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
|
|
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
|
|
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
|
|
1251
|
+
__classPrivateFieldSet(this, _SkyTokensComponent__disabled, !!value, "f");
|
|
1243
1252
|
}
|
|
1244
1253
|
get disabled() {
|
|
1245
|
-
return
|
|
1254
|
+
return __classPrivateFieldGet(this, _SkyTokensComponent__disabled, "f");
|
|
1246
1255
|
}
|
|
1247
1256
|
/**
|
|
1248
|
-
* Indicates whether users can remove
|
|
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
|
|
1261
|
+
__classPrivateFieldSet(this, _SkyTokensComponent__dismissible, value !== false, "f");
|
|
1254
1262
|
}
|
|
1255
1263
|
get dismissible() {
|
|
1256
|
-
return this
|
|
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
|
|
1271
|
+
__classPrivateFieldSet(this, _SkyTokensComponent__displayWith, value || DISPLAY_WITH_DEFAULT, "f");
|
|
1264
1272
|
}
|
|
1265
1273
|
get displayWith() {
|
|
1266
|
-
return this
|
|
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
|
|
1283
|
+
__classPrivateFieldSet(this, _SkyTokensComponent__focusable, value !== false, "f");
|
|
1276
1284
|
}
|
|
1277
1285
|
get focusable() {
|
|
1278
|
-
return this
|
|
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
|
|
1285
|
-
this.
|
|
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
|
|
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
|
|
1296
|
-
this.
|
|
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
|
|
1311
|
+
return __classPrivateFieldGet(this, _SkyTokensComponent__messageStream, "f");
|
|
1300
1312
|
}
|
|
1301
|
-
/**
|
|
1302
|
-
* @internal
|
|
1303
|
-
*/
|
|
1304
1313
|
get activeIndex() {
|
|
1305
|
-
return this
|
|
1314
|
+
return __classPrivateFieldGet(this, _SkyTokensComponent__activeIndex, "f");
|
|
1306
1315
|
}
|
|
1307
1316
|
set activeIndex(value) {
|
|
1308
|
-
if (value >= this.
|
|
1309
|
-
value = this.
|
|
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
|
|
1325
|
+
__classPrivateFieldSet(this, _SkyTokensComponent__activeIndex, value || 0, "f");
|
|
1317
1326
|
}
|
|
1318
1327
|
ngOnDestroy() {
|
|
1319
|
-
this.
|
|
1320
|
-
this.
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
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
|
-
|
|
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.
|
|
1376
|
+
__classPrivateFieldGet(this, _SkyTokensComponent_instances, "m", _SkyTokensComponent_focusActiveToken).call(this);
|
|
1368
1377
|
}
|
|
1369
|
-
|
|
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
|
-
|
|
1378
|
-
|
|
1379
|
-
|
|
1380
|
-
|
|
1381
|
-
|
|
1382
|
-
|
|
1383
|
-
|
|
1384
|
-
|
|
1385
|
-
|
|
1386
|
-
|
|
1387
|
-
|
|
1388
|
-
|
|
1389
|
-
|
|
1390
|
-
|
|
1391
|
-
|
|
1392
|
-
|
|
1393
|
-
|
|
1394
|
-
|
|
1395
|
-
|
|
1396
|
-
|
|
1397
|
-
|
|
1398
|
-
|
|
1399
|
-
|
|
1400
|
-
|
|
1401
|
-
|
|
1402
|
-
|
|
1403
|
-
|
|
1404
|
-
|
|
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
|
-
|
|
1412
|
-
|
|
1413
|
-
|
|
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
|
|
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
|
|
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
|
|
1525
|
-
|
|
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.
|
|
1537
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_clearListeners).call(this);
|
|
1529
1538
|
}
|
|
1530
1539
|
setWaitBounds(waitEl) {
|
|
1531
|
-
this.
|
|
1540
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_renderer, "f").setStyle(waitEl.nativeElement.parentElement, 'position', 'relative');
|
|
1532
1541
|
}
|
|
1533
1542
|
removeWaitBounds(waitEl) {
|
|
1534
|
-
this.
|
|
1543
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_renderer, "f").removeStyle(waitEl.nativeElement.parentElement, 'position');
|
|
1535
1544
|
}
|
|
1536
|
-
setBusyState(waitEl, isFullPage, isWaiting, isNonBlocking
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
1574
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_clearDocumentFocus).call(this);
|
|
1565
1575
|
}
|
|
1566
1576
|
}
|
|
1567
1577
|
});
|
|
1568
|
-
|
|
1569
|
-
|
|
1570
|
-
|
|
1571
|
-
|
|
1572
|
-
|
|
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.
|
|
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.
|
|
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
|
|
1589
|
-
|
|
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
|
-
|
|
1594
|
-
|
|
1595
|
-
|
|
1596
|
-
|
|
1597
|
-
|
|
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.
|
|
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
|
|
1607
|
-
|
|
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 (
|
|
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
|
|
1629
|
+
delete busyElements[waitComponentId];
|
|
1616
1630
|
}
|
|
1617
1631
|
}
|
|
1618
1632
|
}
|
|
1619
1633
|
}
|
|
1620
|
-
|
|
1621
|
-
|
|
1622
|
-
|
|
1623
|
-
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
|
-
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
|
|
1635
|
-
|
|
1636
|
-
|
|
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
|
|
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
|
-
|
|
1690
|
-
|
|
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
|
-
|
|
1693
|
-
|
|
1694
|
-
|
|
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
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1720
|
-
|
|
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,
|
|
1735
|
-
this
|
|
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
|
|
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 (
|
|
1746
|
-
|
|
1747
|
-
|
|
1748
|
-
|
|
1749
|
-
|
|
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.
|
|
1752
|
-
this
|
|
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
|
|
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.
|
|
1800
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_adapterService, "f").removeWaitBounds(__classPrivateFieldGet(this, _SkyWaitComponent_elRef, "f"));
|
|
1768
1801
|
}
|
|
1769
|
-
else if (
|
|
1770
|
-
this.
|
|
1802
|
+
else if (this.isWaiting) {
|
|
1803
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_adapterService, "f").setWaitBounds(__classPrivateFieldGet(this, _SkyWaitComponent_elRef, "f"));
|
|
1771
1804
|
}
|
|
1772
|
-
this
|
|
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
|
|
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.
|
|
1824
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_instances, "m", _SkyWaitComponent_publishAriaLabel).call(this);
|
|
1779
1825
|
}
|
|
1780
|
-
|
|
1781
|
-
|
|
1782
|
-
|
|
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
|
|
1874
|
-
this
|
|
1875
|
-
this
|
|
1876
|
-
this
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
1909
|
-
this.
|
|
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 (
|
|
1916
|
-
|
|
1917
|
-
|
|
1918
|
-
|
|
1919
|
-
this.
|
|
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
|
-
|
|
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
|
-
|
|
1944
|
-
|
|
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
|
-
|
|
2011
|
+
waitComponent.hasNonBlockingWait = true;
|
|
2012
|
+
pageWaitNonBlockingCount++;
|
|
1971
2013
|
}
|
|
1972
2014
|
}
|
|
1973
|
-
|
|
2015
|
+
}, _SkyWaitService_beginPageWait = function _SkyWaitService_beginPageWait(isBlocking) {
|
|
2016
|
+
if (!waitComponent) {
|
|
1974
2017
|
/*
|
|
1975
|
-
|
|
1976
|
-
|
|
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.
|
|
1979
|
-
|
|
1980
|
-
|
|
1981
|
-
|
|
1982
|
-
|
|
1983
|
-
|
|
1984
|
-
|
|
1985
|
-
|
|
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
|
-
|
|
2000
|
-
|
|
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
|
-
|
|
2003
|
-
|
|
2044
|
+
if (pageWaitBlockingCount > 0) {
|
|
2045
|
+
pageWaitBlockingCount--;
|
|
2046
|
+
}
|
|
2047
|
+
if (pageWaitBlockingCount < 1) {
|
|
2048
|
+
waitComponent.hasBlockingWait = false;
|
|
2049
|
+
}
|
|
2004
2050
|
}
|
|
2005
2051
|
else {
|
|
2006
|
-
|
|
2007
|
-
|
|
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: [{
|