@skyux/indicators 6.18.0 → 6.20.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 +1715 -563
- 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/tokens/types/token.mjs +1 -1
- 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 +49 -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 +94 -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 +329 -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 +297 -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/tokens/types/token.d.ts +2 -1
- 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 +6 -0
- package/testing/key-info/key-info-harness.d.ts +31 -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 +6 -0
- package/testing/label/label-harness.d.ts +35 -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,21 @@ 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) {
|
|
1537
1546
|
const busyEl = isFullPage
|
|
1538
1547
|
? document.body
|
|
1539
1548
|
: waitEl.nativeElement.parentElement;
|
|
@@ -1541,18 +1550,18 @@ class SkyWaitAdapterService {
|
|
|
1541
1550
|
if (isWaiting) {
|
|
1542
1551
|
let restoreFocusElement = undefined;
|
|
1543
1552
|
let restoreFocusCheckElement = undefined;
|
|
1544
|
-
this.
|
|
1553
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_renderer, "f").setAttribute(busyEl, 'aria-busy', 'true');
|
|
1545
1554
|
// Remove focus from page when full page blocking wait
|
|
1546
1555
|
if (isFullPage || busyEl.contains(document.activeElement)) {
|
|
1547
1556
|
if (document.activeElement !== document.body) {
|
|
1548
1557
|
restoreFocusElement = document.activeElement;
|
|
1549
1558
|
}
|
|
1550
|
-
this.
|
|
1559
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_clearDocumentFocus).call(this);
|
|
1551
1560
|
restoreFocusCheckElement = document.activeElement;
|
|
1552
1561
|
}
|
|
1553
1562
|
if (isFullPage) {
|
|
1554
1563
|
SkyWaitAdapterService.isPageWaitActive = true;
|
|
1555
|
-
const endListenerFunc = this.
|
|
1564
|
+
const endListenerFunc = __classPrivateFieldGet(this, _SkyWaitAdapterService_renderer, "f").listen(document.body, 'keydown', (event) => {
|
|
1556
1565
|
/*istanbul ignore else */
|
|
1557
1566
|
if (event.key) {
|
|
1558
1567
|
/* istanbul ignore else */
|
|
@@ -1561,198 +1570,221 @@ class SkyWaitAdapterService {
|
|
|
1561
1570
|
event.preventDefault();
|
|
1562
1571
|
event.stopPropagation();
|
|
1563
1572
|
event.stopImmediatePropagation();
|
|
1564
|
-
this.
|
|
1573
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_clearDocumentFocus).call(this);
|
|
1565
1574
|
}
|
|
1566
1575
|
}
|
|
1567
1576
|
});
|
|
1568
|
-
|
|
1569
|
-
|
|
1570
|
-
|
|
1571
|
-
|
|
1572
|
-
|
|
1573
|
-
|
|
1577
|
+
if (waitComponentId) {
|
|
1578
|
+
busyElements[waitComponentId] = {
|
|
1579
|
+
listener: endListenerFunc,
|
|
1580
|
+
busyEl: undefined,
|
|
1581
|
+
restoreFocusElement,
|
|
1582
|
+
restoreFocusCheckElement,
|
|
1583
|
+
};
|
|
1584
|
+
}
|
|
1574
1585
|
}
|
|
1575
1586
|
else {
|
|
1576
|
-
const endListenerFunc = this.
|
|
1587
|
+
const endListenerFunc = __classPrivateFieldGet(this, _SkyWaitAdapterService_renderer, "f").listen(busyEl, 'focusin', (event) => {
|
|
1577
1588
|
/* istanbul ignore else */
|
|
1578
1589
|
if (!isNonBlocking) {
|
|
1579
1590
|
event.preventDefault();
|
|
1580
1591
|
event.stopPropagation();
|
|
1581
1592
|
event.stopImmediatePropagation();
|
|
1582
1593
|
if (SkyWaitAdapterService.isPageWaitActive) {
|
|
1583
|
-
this.
|
|
1594
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_clearDocumentFocus).call(this);
|
|
1584
1595
|
}
|
|
1585
1596
|
else {
|
|
1586
1597
|
// Propagate tab navigation if attempted into waited element
|
|
1587
1598
|
const target = event.target;
|
|
1588
|
-
target
|
|
1589
|
-
|
|
1599
|
+
if (target) {
|
|
1600
|
+
target.blur();
|
|
1601
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_focusNextElement).call(this, target, __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isShift).call(this, event));
|
|
1602
|
+
}
|
|
1590
1603
|
}
|
|
1591
1604
|
}
|
|
1592
1605
|
});
|
|
1593
|
-
|
|
1594
|
-
|
|
1595
|
-
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
|
|
1606
|
+
if (waitComponentId) {
|
|
1607
|
+
busyElements[waitComponentId] = {
|
|
1608
|
+
listener: endListenerFunc,
|
|
1609
|
+
busyEl,
|
|
1610
|
+
restoreFocusElement,
|
|
1611
|
+
restoreFocusCheckElement,
|
|
1612
|
+
};
|
|
1613
|
+
}
|
|
1599
1614
|
}
|
|
1600
1615
|
}
|
|
1601
1616
|
else {
|
|
1602
|
-
this.
|
|
1617
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_renderer, "f").removeAttribute(busyEl, 'aria-busy');
|
|
1603
1618
|
if (isFullPage) {
|
|
1604
1619
|
SkyWaitAdapterService.isPageWaitActive = false;
|
|
1605
1620
|
}
|
|
1606
|
-
if (waitComponentId in
|
|
1607
|
-
|
|
1621
|
+
if (waitComponentId && waitComponentId in busyElements) {
|
|
1622
|
+
const busyElement = busyElements[waitComponentId];
|
|
1623
|
+
busyElement.listener();
|
|
1608
1624
|
// 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();
|
|
1625
|
+
if (busyElement.restoreFocusCheckElement === document.activeElement) {
|
|
1626
|
+
busyElement.restoreFocusElement?.focus();
|
|
1614
1627
|
}
|
|
1615
|
-
delete
|
|
1628
|
+
delete busyElements[waitComponentId];
|
|
1616
1629
|
}
|
|
1617
1630
|
}
|
|
1618
1631
|
}
|
|
1619
1632
|
}
|
|
1620
|
-
|
|
1621
|
-
|
|
1622
|
-
|
|
1623
|
-
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
|
-
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
|
|
1635
|
-
|
|
1636
|
-
|
|
1633
|
+
}
|
|
1634
|
+
_SkyWaitAdapterService_focusableElements = new WeakMap(), _SkyWaitAdapterService_renderer = new WeakMap(), _SkyWaitAdapterService_instances = new WeakSet(), _SkyWaitAdapterService_focusNextElement = function _SkyWaitAdapterService_focusNextElement(targetElement, shiftKey) {
|
|
1635
|
+
const focusable = __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_getFocusableElements).call(this);
|
|
1636
|
+
// If shift tab, go in the other direction
|
|
1637
|
+
const modifier = shiftKey ? -1 : 1;
|
|
1638
|
+
// Find the next navigable element that isn't waiting
|
|
1639
|
+
const startingIndex = focusable.indexOf(targetElement);
|
|
1640
|
+
let curIndex = startingIndex + modifier;
|
|
1641
|
+
while (focusable[curIndex] &&
|
|
1642
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isElementBusyOrHidden).call(this, focusable[curIndex])) {
|
|
1643
|
+
curIndex += modifier;
|
|
1644
|
+
}
|
|
1645
|
+
if (focusable[curIndex] &&
|
|
1646
|
+
!__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isElementBusyOrHidden).call(this, focusable[curIndex])) {
|
|
1647
|
+
focusable[curIndex].focus();
|
|
1648
|
+
}
|
|
1649
|
+
else {
|
|
1650
|
+
// Try wrapping the navigation
|
|
1651
|
+
/* istanbul ignore next */
|
|
1652
|
+
/* sanity check */
|
|
1653
|
+
curIndex = modifier > 0 ? 0 : focusable.length - 1;
|
|
1654
|
+
while (curIndex !== startingIndex &&
|
|
1655
|
+
focusable[curIndex] &&
|
|
1656
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isElementBusyOrHidden).call(this, focusable[curIndex])) {
|
|
1637
1657
|
/* istanbul ignore next */
|
|
1638
1658
|
/* 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
|
-
}
|
|
1659
|
+
curIndex += modifier;
|
|
1684
1660
|
}
|
|
1685
|
-
return false;
|
|
1686
|
-
}
|
|
1687
|
-
clearDocumentFocus() {
|
|
1688
1661
|
/* istanbul ignore else */
|
|
1689
|
-
|
|
1690
|
-
|
|
1662
|
+
/* sanity check */
|
|
1663
|
+
if (focusable[curIndex] &&
|
|
1664
|
+
!__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isElementBusyOrHidden).call(this, focusable[curIndex])) {
|
|
1665
|
+
focusable[curIndex].focus();
|
|
1691
1666
|
}
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
|
|
1695
|
-
// Keep this cached so we can reduce querys
|
|
1696
|
-
if (this.focussableElements) {
|
|
1697
|
-
return this.focussableElements;
|
|
1667
|
+
else {
|
|
1668
|
+
// No valid target, wipe focus
|
|
1669
|
+
__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_clearDocumentFocus).call(this);
|
|
1698
1670
|
}
|
|
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
1671
|
}
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1720
|
-
|
|
1672
|
+
// clear focusableElements list
|
|
1673
|
+
__classPrivateFieldSet(this, _SkyWaitAdapterService_focusableElements, undefined, "f");
|
|
1674
|
+
}, _SkyWaitAdapterService_isShift = function _SkyWaitAdapterService_isShift(event) {
|
|
1675
|
+
// Determine if shift+tab was used based on element order
|
|
1676
|
+
const elements = __classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_getFocusableElements).call(this).filter((elem) => !__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isElementHidden).call(this, elem));
|
|
1677
|
+
const previousInd = elements.indexOf(event.relatedTarget);
|
|
1678
|
+
const currentInd = elements.indexOf(event.target);
|
|
1679
|
+
return (previousInd === currentInd + 1 ||
|
|
1680
|
+
(previousInd === 0 && currentInd === elements.length - 1) ||
|
|
1681
|
+
previousInd > currentInd ||
|
|
1682
|
+
!event.relatedTarget);
|
|
1683
|
+
}, _SkyWaitAdapterService_isElementHidden = function _SkyWaitAdapterService_isElementHidden(element) {
|
|
1684
|
+
const style = window.getComputedStyle(element);
|
|
1685
|
+
return style.display === 'none' || style.visibility === 'hidden';
|
|
1686
|
+
}, _SkyWaitAdapterService_isElementBusyOrHidden = function _SkyWaitAdapterService_isElementBusyOrHidden(element) {
|
|
1687
|
+
if (__classPrivateFieldGet(this, _SkyWaitAdapterService_instances, "m", _SkyWaitAdapterService_isElementHidden).call(this, element)) {
|
|
1688
|
+
return true;
|
|
1689
|
+
}
|
|
1690
|
+
for (const key of Object.keys(busyElements)) {
|
|
1691
|
+
const parentElement = busyElements[key].busyEl;
|
|
1692
|
+
if (parentElement && parentElement.contains(element)) {
|
|
1693
|
+
return true;
|
|
1721
1694
|
}
|
|
1722
1695
|
}
|
|
1723
|
-
|
|
1696
|
+
return false;
|
|
1697
|
+
}, _SkyWaitAdapterService_clearDocumentFocus = function _SkyWaitAdapterService_clearDocumentFocus() {
|
|
1698
|
+
const activeElement = document.activeElement;
|
|
1699
|
+
/* istanbul ignore else */
|
|
1700
|
+
if (activeElement) {
|
|
1701
|
+
activeElement.blur();
|
|
1702
|
+
}
|
|
1703
|
+
document.body.focus();
|
|
1704
|
+
}, _SkyWaitAdapterService_getFocusableElements = function _SkyWaitAdapterService_getFocusableElements() {
|
|
1705
|
+
// Keep this cached so we can reduce queries
|
|
1706
|
+
if (__classPrivateFieldGet(this, _SkyWaitAdapterService_focusableElements, "f")) {
|
|
1707
|
+
return __classPrivateFieldGet(this, _SkyWaitAdapterService_focusableElements, "f");
|
|
1708
|
+
}
|
|
1709
|
+
// Select all possible focusable elements
|
|
1710
|
+
const focusableElements = 'a[href], ' +
|
|
1711
|
+
'area[href], ' +
|
|
1712
|
+
"input:not([disabled]):not([tabindex='-1']), " +
|
|
1713
|
+
"button:not([disabled]):not([tabindex='-1']), " +
|
|
1714
|
+
"select:not([disabled]):not([tabindex='-1']), " +
|
|
1715
|
+
"textarea:not([disabled]):not([tabindex='-1']), " +
|
|
1716
|
+
'iframe, object, embed, ' +
|
|
1717
|
+
"*[tabindex]:not([tabindex='-1']), " +
|
|
1718
|
+
'*[contenteditable=true]';
|
|
1719
|
+
__classPrivateFieldSet(this, _SkyWaitAdapterService_focusableElements, Array.prototype.filter.call(document.body.querySelectorAll(focusableElements), (element) => {
|
|
1720
|
+
return (element.offsetWidth > 0 ||
|
|
1721
|
+
element.offsetHeight > 0 ||
|
|
1722
|
+
element === document.activeElement);
|
|
1723
|
+
}), "f");
|
|
1724
|
+
return __classPrivateFieldGet(this, _SkyWaitAdapterService_focusableElements, "f");
|
|
1725
|
+
}, _SkyWaitAdapterService_clearListeners = function _SkyWaitAdapterService_clearListeners() {
|
|
1726
|
+
SkyWaitAdapterService.isPageWaitActive = false;
|
|
1727
|
+
for (const key of Object.keys(busyElements)) {
|
|
1728
|
+
busyElements[key].listener();
|
|
1729
|
+
delete busyElements[key];
|
|
1730
|
+
}
|
|
1731
|
+
};
|
|
1724
1732
|
SkyWaitAdapterService.isPageWaitActive = false;
|
|
1725
|
-
SkyWaitAdapterService.busyElements = {};
|
|
1726
1733
|
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
1734
|
SkyWaitAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitAdapterService });
|
|
1728
1735
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitAdapterService, decorators: [{
|
|
1729
1736
|
type: Injectable
|
|
1730
1737
|
}], ctorParameters: function () { return [{ type: i0.RendererFactory2 }]; } });
|
|
1731
1738
|
|
|
1739
|
+
var _SkyWaitComponent_instances, _SkyWaitComponent_elRef, _SkyWaitComponent_adapterService, _SkyWaitComponent_resourceSvc, _SkyWaitComponent_ngUnsubscribe, _SkyWaitComponent_id, _SkyWaitComponent_customAriaLabel, _SkyWaitComponent__isFullPage, _SkyWaitComponent__isNonBlocking, _SkyWaitComponent__isWaiting, _SkyWaitComponent_publishAriaLabel;
|
|
1732
1740
|
let nextId = 0;
|
|
1733
1741
|
class SkyWaitComponent {
|
|
1734
|
-
constructor(elRef, adapterService,
|
|
1735
|
-
this
|
|
1736
|
-
this.adapterService = adapterService;
|
|
1737
|
-
this.resourceService = resourceService;
|
|
1742
|
+
constructor(elRef, adapterService, resourceSvc) {
|
|
1743
|
+
_SkyWaitComponent_instances.add(this);
|
|
1738
1744
|
this.ariaLabelStream = new BehaviorSubject('');
|
|
1739
|
-
this
|
|
1745
|
+
_SkyWaitComponent_elRef.set(this, void 0);
|
|
1746
|
+
_SkyWaitComponent_adapterService.set(this, void 0);
|
|
1747
|
+
_SkyWaitComponent_resourceSvc.set(this, void 0);
|
|
1748
|
+
_SkyWaitComponent_ngUnsubscribe.set(this, new Subject());
|
|
1749
|
+
_SkyWaitComponent_id.set(this, void 0);
|
|
1750
|
+
_SkyWaitComponent_customAriaLabel.set(this, void 0);
|
|
1751
|
+
_SkyWaitComponent__isFullPage.set(this, void 0);
|
|
1752
|
+
_SkyWaitComponent__isNonBlocking.set(this, void 0);
|
|
1753
|
+
_SkyWaitComponent__isWaiting.set(this, void 0);
|
|
1754
|
+
__classPrivateFieldSet(this, _SkyWaitComponent_elRef, elRef, "f");
|
|
1755
|
+
__classPrivateFieldSet(this, _SkyWaitComponent_adapterService, adapterService, "f");
|
|
1756
|
+
__classPrivateFieldSet(this, _SkyWaitComponent_resourceSvc, resourceSvc, "f");
|
|
1757
|
+
__classPrivateFieldSet(this, _SkyWaitComponent_id, `sky-wait-${++nextId}`, "f");
|
|
1758
|
+
}
|
|
1759
|
+
/**
|
|
1760
|
+
* Specifies an ARIA label for the wait icon while an element or page loads.
|
|
1761
|
+
* This sets the icon's `aria-label` attribute
|
|
1762
|
+
* [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).
|
|
1763
|
+
* The default value varies based on whether the wait is for an element or a page
|
|
1764
|
+
* and whether it is a blocking wait. For example, the default for a page-blocking
|
|
1765
|
+
* wait is "Page loading. Please wait."
|
|
1766
|
+
*/
|
|
1767
|
+
set ariaLabel(value) {
|
|
1768
|
+
__classPrivateFieldSet(this, _SkyWaitComponent_customAriaLabel, value, "f");
|
|
1769
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_instances, "m", _SkyWaitComponent_publishAriaLabel).call(this);
|
|
1740
1770
|
}
|
|
1741
1771
|
/**
|
|
1742
1772
|
* When set to `true`, wait indication appears on the parent element of the `sky-wait` component.
|
|
1743
1773
|
*/
|
|
1744
1774
|
set isWaiting(value) {
|
|
1745
|
-
if (
|
|
1746
|
-
|
|
1747
|
-
|
|
1748
|
-
|
|
1749
|
-
|
|
1775
|
+
if (!this.isFullPage) {
|
|
1776
|
+
if (value) {
|
|
1777
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_adapterService, "f").setWaitBounds(__classPrivateFieldGet(this, _SkyWaitComponent_elRef, "f"));
|
|
1778
|
+
}
|
|
1779
|
+
else {
|
|
1780
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_adapterService, "f").removeWaitBounds(__classPrivateFieldGet(this, _SkyWaitComponent_elRef, "f"));
|
|
1781
|
+
}
|
|
1750
1782
|
}
|
|
1751
|
-
this.
|
|
1752
|
-
this
|
|
1783
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_adapterService, "f").setBusyState(__classPrivateFieldGet(this, _SkyWaitComponent_elRef, "f"), !!this.isFullPage, !!value, !!this.isNonBlocking, __classPrivateFieldGet(this, _SkyWaitComponent_id, "f"));
|
|
1784
|
+
__classPrivateFieldSet(this, _SkyWaitComponent__isWaiting, value, "f");
|
|
1753
1785
|
}
|
|
1754
1786
|
get isWaiting() {
|
|
1755
|
-
return this
|
|
1787
|
+
return __classPrivateFieldGet(this, _SkyWaitComponent__isWaiting, "f");
|
|
1756
1788
|
}
|
|
1757
1789
|
/**
|
|
1758
1790
|
* When set to `true`, wait indication appears on the page level instead of the
|
|
@@ -1764,35 +1796,55 @@ class SkyWaitComponent {
|
|
|
1764
1796
|
set isFullPage(value) {
|
|
1765
1797
|
/* istanbul ignore else: untestable */
|
|
1766
1798
|
if (value) {
|
|
1767
|
-
this.
|
|
1799
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_adapterService, "f").removeWaitBounds(__classPrivateFieldGet(this, _SkyWaitComponent_elRef, "f"));
|
|
1768
1800
|
}
|
|
1769
|
-
else if (
|
|
1770
|
-
this.
|
|
1801
|
+
else if (this.isWaiting) {
|
|
1802
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_adapterService, "f").setWaitBounds(__classPrivateFieldGet(this, _SkyWaitComponent_elRef, "f"));
|
|
1771
1803
|
}
|
|
1772
|
-
this
|
|
1804
|
+
__classPrivateFieldSet(this, _SkyWaitComponent__isFullPage, value, "f");
|
|
1805
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_instances, "m", _SkyWaitComponent_publishAriaLabel).call(this);
|
|
1773
1806
|
}
|
|
1774
1807
|
get isFullPage() {
|
|
1775
|
-
return this
|
|
1808
|
+
return __classPrivateFieldGet(this, _SkyWaitComponent__isFullPage, "f");
|
|
1809
|
+
}
|
|
1810
|
+
/**
|
|
1811
|
+
* When set to `true`, wait indication appears in the bottom left corner of the element
|
|
1812
|
+
* instead of hiding the entire parent element.
|
|
1813
|
+
* @default false
|
|
1814
|
+
*/
|
|
1815
|
+
set isNonBlocking(value) {
|
|
1816
|
+
__classPrivateFieldSet(this, _SkyWaitComponent__isNonBlocking, value, "f");
|
|
1817
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_instances, "m", _SkyWaitComponent_publishAriaLabel).call(this);
|
|
1818
|
+
}
|
|
1819
|
+
get isNonBlocking() {
|
|
1820
|
+
return __classPrivateFieldGet(this, _SkyWaitComponent__isNonBlocking, "f");
|
|
1776
1821
|
}
|
|
1777
1822
|
ngOnInit() {
|
|
1778
|
-
this.
|
|
1823
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_instances, "m", _SkyWaitComponent_publishAriaLabel).call(this);
|
|
1779
1824
|
}
|
|
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
|
-
}
|
|
1825
|
+
ngOnDestroy() {
|
|
1826
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_ngUnsubscribe, "f").next();
|
|
1827
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_ngUnsubscribe, "f").complete();
|
|
1794
1828
|
}
|
|
1795
1829
|
}
|
|
1830
|
+
_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() {
|
|
1831
|
+
if (__classPrivateFieldGet(this, _SkyWaitComponent_customAriaLabel, "f")) {
|
|
1832
|
+
this.ariaLabelStream.next(__classPrivateFieldGet(this, _SkyWaitComponent_customAriaLabel, "f"));
|
|
1833
|
+
return;
|
|
1834
|
+
}
|
|
1835
|
+
/* istanbul ignore else */
|
|
1836
|
+
if (__classPrivateFieldGet(this, _SkyWaitComponent_resourceSvc, "f")) {
|
|
1837
|
+
const type = this.isFullPage ? '_page' : '';
|
|
1838
|
+
const blocking = this.isNonBlocking ? '' : '_blocking';
|
|
1839
|
+
const key = `skyux_wait${type}${blocking}_aria_alt_text`;
|
|
1840
|
+
__classPrivateFieldGet(this, _SkyWaitComponent_resourceSvc, "f")
|
|
1841
|
+
.getString(key)
|
|
1842
|
+
.pipe(take(1), takeUntil(__classPrivateFieldGet(this, _SkyWaitComponent_ngUnsubscribe, "f")))
|
|
1843
|
+
.subscribe((value) => {
|
|
1844
|
+
this.ariaLabelStream.next(value);
|
|
1845
|
+
});
|
|
1846
|
+
}
|
|
1847
|
+
};
|
|
1796
1848
|
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
1849
|
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
1850
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitComponent, decorators: [{
|
|
@@ -1863,58 +1915,67 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
|
|
|
1863
1915
|
}]
|
|
1864
1916
|
}] });
|
|
1865
1917
|
|
|
1918
|
+
var _SkyWaitService_instances, _SkyWaitService_resolver, _SkyWaitService_appRef, _SkyWaitService_waitAdapter, _SkyWaitService_windowSvc, _SkyWaitService_setWaitComponentProperties, _SkyWaitService_beginPageWait, _SkyWaitService_endPageWait, _SkyWaitService_clearPageWait;
|
|
1919
|
+
let waitComponent;
|
|
1920
|
+
let pageWaitBlockingCount = 0;
|
|
1921
|
+
let pageWaitNonBlockingCount = 0;
|
|
1866
1922
|
// Need to add the following to classes which contain static methods.
|
|
1867
1923
|
// See: https://github.com/ng-packagr/ng-packagr/issues/641
|
|
1868
1924
|
// @dynamic
|
|
1869
1925
|
class SkyWaitService {
|
|
1870
1926
|
constructor(resolver, appRef, waitAdapter, windowSvc) {
|
|
1871
|
-
this
|
|
1872
|
-
this
|
|
1873
|
-
this
|
|
1874
|
-
this
|
|
1927
|
+
_SkyWaitService_instances.add(this);
|
|
1928
|
+
_SkyWaitService_resolver.set(this, void 0);
|
|
1929
|
+
_SkyWaitService_appRef.set(this, void 0);
|
|
1930
|
+
_SkyWaitService_waitAdapter.set(this, void 0);
|
|
1931
|
+
_SkyWaitService_windowSvc.set(this, void 0);
|
|
1932
|
+
__classPrivateFieldSet(this, _SkyWaitService_resolver, resolver, "f");
|
|
1933
|
+
__classPrivateFieldSet(this, _SkyWaitService_appRef, appRef, "f");
|
|
1934
|
+
__classPrivateFieldSet(this, _SkyWaitService_waitAdapter, waitAdapter, "f");
|
|
1935
|
+
__classPrivateFieldSet(this, _SkyWaitService_windowSvc, windowSvc, "f");
|
|
1875
1936
|
}
|
|
1876
1937
|
/**
|
|
1877
1938
|
* Starts a blocking page wait on the page.
|
|
1878
1939
|
*/
|
|
1879
1940
|
beginBlockingPageWait() {
|
|
1880
|
-
this.
|
|
1941
|
+
__classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_beginPageWait).call(this, true);
|
|
1881
1942
|
}
|
|
1882
1943
|
/**
|
|
1883
1944
|
* Starts a non-blocking page wait on the page.
|
|
1884
1945
|
*/
|
|
1885
1946
|
beginNonBlockingPageWait() {
|
|
1886
|
-
this.
|
|
1947
|
+
__classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_beginPageWait).call(this, false);
|
|
1887
1948
|
}
|
|
1888
1949
|
/**
|
|
1889
1950
|
* Ends a blocking page wait on the page. Blocking page wait indication
|
|
1890
1951
|
* is removed when all running blocking page waits are ended.
|
|
1891
1952
|
*/
|
|
1892
1953
|
endBlockingPageWait() {
|
|
1893
|
-
this.
|
|
1954
|
+
__classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_endPageWait).call(this, true);
|
|
1894
1955
|
}
|
|
1895
1956
|
/**
|
|
1896
1957
|
* Ends a non-blocking page wait on the page. Non-blocking page wait indication
|
|
1897
1958
|
* is removed when all running non-blocking page waits are ended.
|
|
1898
1959
|
*/
|
|
1899
1960
|
endNonBlockingPageWait() {
|
|
1900
|
-
this.
|
|
1961
|
+
__classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_endPageWait).call(this, false);
|
|
1901
1962
|
}
|
|
1902
1963
|
/**
|
|
1903
1964
|
* Clears all blocking and non-blocking page waits on the page.
|
|
1904
1965
|
*/
|
|
1905
1966
|
clearAllPageWaits() {
|
|
1906
|
-
this.
|
|
1907
|
-
this.
|
|
1967
|
+
__classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_clearPageWait).call(this, true);
|
|
1968
|
+
__classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_clearPageWait).call(this, false);
|
|
1908
1969
|
}
|
|
1909
1970
|
/**
|
|
1910
1971
|
* @internal
|
|
1911
1972
|
*/
|
|
1912
1973
|
dispose() {
|
|
1913
|
-
if (
|
|
1914
|
-
|
|
1915
|
-
|
|
1916
|
-
|
|
1917
|
-
this.
|
|
1974
|
+
if (waitComponent) {
|
|
1975
|
+
waitComponent = undefined;
|
|
1976
|
+
pageWaitBlockingCount = 0;
|
|
1977
|
+
pageWaitNonBlockingCount = 0;
|
|
1978
|
+
__classPrivateFieldGet(this, _SkyWaitService_waitAdapter, "f").removePageWaitEl();
|
|
1918
1979
|
}
|
|
1919
1980
|
}
|
|
1920
1981
|
/**
|
|
@@ -1936,79 +1997,76 @@ class SkyWaitService {
|
|
|
1936
1997
|
return observable.pipe(finalize(() => this.endNonBlockingPageWait()));
|
|
1937
1998
|
});
|
|
1938
1999
|
}
|
|
1939
|
-
|
|
2000
|
+
}
|
|
2001
|
+
_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) {
|
|
2002
|
+
if (waitComponent) {
|
|
1940
2003
|
if (isBlocking) {
|
|
1941
|
-
|
|
1942
|
-
|
|
1943
|
-
}
|
|
1944
|
-
else {
|
|
1945
|
-
SkyWaitService.waitComponent.hasNonBlockingWait = true;
|
|
1946
|
-
SkyWaitService.pageWaitNonBlockingCount++;
|
|
1947
|
-
}
|
|
1948
|
-
}
|
|
1949
|
-
beginPageWait(isBlocking) {
|
|
1950
|
-
if (!SkyWaitService.waitComponent) {
|
|
1951
|
-
/*
|
|
1952
|
-
Dynamic component creation needs to be done in a timeout to prevent ApplicationRef from
|
|
1953
|
-
crashing when wait service is called in Angular lifecycle functions.
|
|
1954
|
-
*/
|
|
1955
|
-
this.windowSvc.nativeWindow.setTimeout(() => {
|
|
1956
|
-
// Ensuring here that we recheck this after the setTimeout is over so that we don't clash
|
|
1957
|
-
// with any other waits that are created.
|
|
1958
|
-
if (!SkyWaitService.waitComponent) {
|
|
1959
|
-
const factory = this.resolver.resolveComponentFactory(SkyWaitPageComponent);
|
|
1960
|
-
this.waitAdapter.addPageWaitEl();
|
|
1961
|
-
const cmpRef = this.appRef.bootstrap(factory);
|
|
1962
|
-
SkyWaitService.waitComponent = cmpRef.instance;
|
|
1963
|
-
}
|
|
1964
|
-
this.setWaitComponentProperties(isBlocking);
|
|
1965
|
-
});
|
|
2004
|
+
waitComponent.hasBlockingWait = true;
|
|
2005
|
+
pageWaitBlockingCount++;
|
|
1966
2006
|
}
|
|
1967
2007
|
else {
|
|
1968
|
-
|
|
2008
|
+
waitComponent.hasNonBlockingWait = true;
|
|
2009
|
+
pageWaitNonBlockingCount++;
|
|
1969
2010
|
}
|
|
1970
2011
|
}
|
|
1971
|
-
|
|
2012
|
+
}, _SkyWaitService_beginPageWait = function _SkyWaitService_beginPageWait(isBlocking) {
|
|
2013
|
+
if (!waitComponent) {
|
|
1972
2014
|
/*
|
|
1973
|
-
|
|
1974
|
-
|
|
2015
|
+
Dynamic component creation needs to be done in a timeout to prevent ApplicationRef from
|
|
2016
|
+
crashing when wait service is called in Angular lifecycle functions.
|
|
1975
2017
|
*/
|
|
1976
|
-
this.
|
|
1977
|
-
|
|
1978
|
-
|
|
1979
|
-
|
|
1980
|
-
|
|
1981
|
-
|
|
1982
|
-
|
|
1983
|
-
|
|
1984
|
-
}
|
|
1985
|
-
}
|
|
1986
|
-
else {
|
|
1987
|
-
if (SkyWaitService.pageWaitNonBlockingCount > 0) {
|
|
1988
|
-
SkyWaitService.pageWaitNonBlockingCount--;
|
|
1989
|
-
}
|
|
1990
|
-
if (SkyWaitService.pageWaitNonBlockingCount < 1) {
|
|
1991
|
-
SkyWaitService.waitComponent.hasNonBlockingWait = false;
|
|
1992
|
-
}
|
|
1993
|
-
}
|
|
2018
|
+
__classPrivateFieldGet(this, _SkyWaitService_windowSvc, "f").nativeWindow.setTimeout(() => {
|
|
2019
|
+
// Ensuring here that we recheck this after the setTimeout is over so that we don't clash
|
|
2020
|
+
// with any other waits that are created.
|
|
2021
|
+
if (!waitComponent) {
|
|
2022
|
+
const factory = __classPrivateFieldGet(this, _SkyWaitService_resolver, "f").resolveComponentFactory(SkyWaitPageComponent);
|
|
2023
|
+
__classPrivateFieldGet(this, _SkyWaitService_waitAdapter, "f").addPageWaitEl();
|
|
2024
|
+
const cmpRef = __classPrivateFieldGet(this, _SkyWaitService_appRef, "f").bootstrap(factory);
|
|
2025
|
+
waitComponent = cmpRef.instance;
|
|
1994
2026
|
}
|
|
2027
|
+
__classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_setWaitComponentProperties).call(this, isBlocking);
|
|
1995
2028
|
});
|
|
1996
2029
|
}
|
|
1997
|
-
|
|
1998
|
-
|
|
2030
|
+
else {
|
|
2031
|
+
__classPrivateFieldGet(this, _SkyWaitService_instances, "m", _SkyWaitService_setWaitComponentProperties).call(this, isBlocking);
|
|
2032
|
+
}
|
|
2033
|
+
}, _SkyWaitService_endPageWait = function _SkyWaitService_endPageWait(isBlocking) {
|
|
2034
|
+
/*
|
|
2035
|
+
Needs to yield so that wait creation can finish
|
|
2036
|
+
before it is dismissed in the event of a race.
|
|
2037
|
+
*/
|
|
2038
|
+
__classPrivateFieldGet(this, _SkyWaitService_windowSvc, "f").nativeWindow.setTimeout(() => {
|
|
2039
|
+
if (waitComponent) {
|
|
1999
2040
|
if (isBlocking) {
|
|
2000
|
-
|
|
2001
|
-
|
|
2041
|
+
if (pageWaitBlockingCount > 0) {
|
|
2042
|
+
pageWaitBlockingCount--;
|
|
2043
|
+
}
|
|
2044
|
+
if (pageWaitBlockingCount < 1) {
|
|
2045
|
+
waitComponent.hasBlockingWait = false;
|
|
2046
|
+
}
|
|
2002
2047
|
}
|
|
2003
2048
|
else {
|
|
2004
|
-
|
|
2005
|
-
|
|
2049
|
+
if (pageWaitNonBlockingCount > 0) {
|
|
2050
|
+
pageWaitNonBlockingCount--;
|
|
2051
|
+
}
|
|
2052
|
+
if (pageWaitNonBlockingCount < 1) {
|
|
2053
|
+
waitComponent.hasNonBlockingWait = false;
|
|
2054
|
+
}
|
|
2006
2055
|
}
|
|
2007
2056
|
}
|
|
2057
|
+
});
|
|
2058
|
+
}, _SkyWaitService_clearPageWait = function _SkyWaitService_clearPageWait(isBlocking) {
|
|
2059
|
+
if (waitComponent) {
|
|
2060
|
+
if (isBlocking) {
|
|
2061
|
+
pageWaitBlockingCount = 0;
|
|
2062
|
+
waitComponent.hasBlockingWait = false;
|
|
2063
|
+
}
|
|
2064
|
+
else {
|
|
2065
|
+
pageWaitNonBlockingCount = 0;
|
|
2066
|
+
waitComponent.hasNonBlockingWait = false;
|
|
2067
|
+
}
|
|
2008
2068
|
}
|
|
2009
|
-
}
|
|
2010
|
-
SkyWaitService.pageWaitBlockingCount = 0;
|
|
2011
|
-
SkyWaitService.pageWaitNonBlockingCount = 0;
|
|
2069
|
+
};
|
|
2012
2070
|
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 });
|
|
2013
2071
|
SkyWaitService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitService, providedIn: 'root' });
|
|
2014
2072
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyWaitService, decorators: [{
|