ngx-loading-fork 20.0.2 → 21.0.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.
|
@@ -33,10 +33,10 @@ class NgxLoadingService {
|
|
|
33
33
|
this.config = config;
|
|
34
34
|
this.loadingConfig = this.config || new NgxLoadingConfig();
|
|
35
35
|
}
|
|
36
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
37
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
36
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: NgxLoadingService, deps: [{ token: 'loadingConfig', optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
37
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: NgxLoadingService, providedIn: 'root' }); }
|
|
38
38
|
}
|
|
39
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
39
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: NgxLoadingService, decorators: [{
|
|
40
40
|
type: Injectable,
|
|
41
41
|
args: [{
|
|
42
42
|
providedIn: 'root',
|
|
@@ -78,390 +78,12 @@ class NgxLoadingComponent {
|
|
|
78
78
|
: this.defaultConfig[option];
|
|
79
79
|
}
|
|
80
80
|
}
|
|
81
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
82
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: NgxLoadingComponent, isStandalone: true, selector: "ngx-loading", inputs: { show: "show", config: "config", template: "template" }, ngImport: i0, template: `
|
|
83
|
-
<div *ngIf="show">
|
|
84
|
-
<div
|
|
85
|
-
class="backdrop"
|
|
86
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
87
|
-
[ngStyle]="{
|
|
88
|
-
'border-radius': config.backdropBorderRadius,
|
|
89
|
-
'background-color': config.backdropBackgroundColour
|
|
90
|
-
}"
|
|
91
|
-
></div>
|
|
92
|
-
|
|
93
|
-
<div [ngSwitch]="config.animationType">
|
|
94
|
-
<div
|
|
95
|
-
class="spinner-circle"
|
|
96
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.circle"
|
|
97
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
98
|
-
[ngStyle]="{
|
|
99
|
-
'border-top-color': config.secondaryColour,
|
|
100
|
-
'border-right-color': config.secondaryColour,
|
|
101
|
-
'border-bottom-color': config.secondaryColour,
|
|
102
|
-
'border-left-color': config.primaryColour
|
|
103
|
-
}"
|
|
104
|
-
></div>
|
|
105
|
-
|
|
106
|
-
<div
|
|
107
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.cubeGrid"
|
|
108
|
-
class="sk-cube-grid"
|
|
109
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
110
|
-
>
|
|
111
|
-
<div
|
|
112
|
-
class="sk-cube sk-cube1"
|
|
113
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
114
|
-
></div>
|
|
115
|
-
<div
|
|
116
|
-
class="sk-cube sk-cube2"
|
|
117
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
118
|
-
></div>
|
|
119
|
-
<div
|
|
120
|
-
class="sk-cube sk-cube3"
|
|
121
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
122
|
-
></div>
|
|
123
|
-
<div
|
|
124
|
-
class="sk-cube sk-cube4"
|
|
125
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
126
|
-
></div>
|
|
127
|
-
<div
|
|
128
|
-
class="sk-cube sk-cube5"
|
|
129
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
130
|
-
></div>
|
|
131
|
-
<div
|
|
132
|
-
class="sk-cube sk-cube6"
|
|
133
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
134
|
-
></div>
|
|
135
|
-
<div
|
|
136
|
-
class="sk-cube sk-cube7"
|
|
137
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
138
|
-
></div>
|
|
139
|
-
<div
|
|
140
|
-
class="sk-cube sk-cube8"
|
|
141
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
142
|
-
></div>
|
|
143
|
-
<div
|
|
144
|
-
class="sk-cube sk-cube9"
|
|
145
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
146
|
-
></div>
|
|
147
|
-
</div>
|
|
148
|
-
|
|
149
|
-
<div
|
|
150
|
-
class="spinner-sk-rotateplane"
|
|
151
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.rotatingPlane"
|
|
152
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
153
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
154
|
-
></div>
|
|
155
|
-
|
|
156
|
-
<div
|
|
157
|
-
class="spinner-rectangle-bounce"
|
|
158
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.rectangleBounce"
|
|
159
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
160
|
-
>
|
|
161
|
-
<div
|
|
162
|
-
class="rect1"
|
|
163
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
164
|
-
></div>
|
|
165
|
-
<div
|
|
166
|
-
class="rect2"
|
|
167
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
168
|
-
></div>
|
|
169
|
-
<div
|
|
170
|
-
class="rect3"
|
|
171
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
172
|
-
></div>
|
|
173
|
-
<div
|
|
174
|
-
class="rect4"
|
|
175
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
176
|
-
></div>
|
|
177
|
-
<div
|
|
178
|
-
class="rect5"
|
|
179
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
180
|
-
></div>
|
|
181
|
-
</div>
|
|
182
|
-
|
|
183
|
-
<div
|
|
184
|
-
class="spinner-wandering-cubes"
|
|
185
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.wanderingCubes"
|
|
186
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
187
|
-
>
|
|
188
|
-
<div
|
|
189
|
-
class="cube1"
|
|
190
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
191
|
-
></div>
|
|
192
|
-
<div
|
|
193
|
-
class="cube2"
|
|
194
|
-
[ngStyle]="{ 'background-color': config.secondaryColour }"
|
|
195
|
-
></div>
|
|
196
|
-
</div>
|
|
197
|
-
|
|
198
|
-
<div
|
|
199
|
-
class="spinner-double-bounce"
|
|
200
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.doubleBounce"
|
|
201
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
202
|
-
>
|
|
203
|
-
<div
|
|
204
|
-
class="double-bounce1"
|
|
205
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
206
|
-
></div>
|
|
207
|
-
<div
|
|
208
|
-
class="double-bounce2"
|
|
209
|
-
[ngStyle]="{ 'background-color': config.secondaryColour }"
|
|
210
|
-
></div>
|
|
211
|
-
</div>
|
|
212
|
-
|
|
213
|
-
<div
|
|
214
|
-
class="spinner-pulse"
|
|
215
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.pulse"
|
|
216
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
217
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
218
|
-
></div>
|
|
219
|
-
|
|
220
|
-
<div
|
|
221
|
-
class="spinner-chasing-dots"
|
|
222
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.chasingDots"
|
|
223
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
224
|
-
>
|
|
225
|
-
<div
|
|
226
|
-
class="dot1"
|
|
227
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
228
|
-
></div>
|
|
229
|
-
<div
|
|
230
|
-
class="dot2"
|
|
231
|
-
[ngStyle]="{ 'background-color': config.secondaryColour }"
|
|
232
|
-
></div>
|
|
233
|
-
</div>
|
|
234
|
-
|
|
235
|
-
<div
|
|
236
|
-
class="spinner-circle-swish"
|
|
237
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.circleSwish"
|
|
238
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
239
|
-
[ngStyle]="{ color: config.primaryColour }"
|
|
240
|
-
></div>
|
|
241
|
-
|
|
242
|
-
<div
|
|
243
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.none"
|
|
244
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
245
|
-
></div>
|
|
246
|
-
|
|
247
|
-
<div
|
|
248
|
-
*ngSwitchDefault
|
|
249
|
-
class="spinner-three-bounce"
|
|
250
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
251
|
-
>
|
|
252
|
-
<div
|
|
253
|
-
class="bounce1"
|
|
254
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
255
|
-
></div>
|
|
256
|
-
<div
|
|
257
|
-
class="bounce2"
|
|
258
|
-
[ngStyle]="{ 'background-color': config.secondaryColour }"
|
|
259
|
-
></div>
|
|
260
|
-
<div
|
|
261
|
-
class="bounce3"
|
|
262
|
-
[ngStyle]="{ 'background-color': config.tertiaryColour }"
|
|
263
|
-
></div>
|
|
264
|
-
</div>
|
|
265
|
-
|
|
266
|
-
<ng-container *ngIf="template">
|
|
267
|
-
<ng-container *ngTemplateOutlet="template"></ng-container>
|
|
268
|
-
</ng-container>
|
|
269
|
-
</div>
|
|
270
|
-
</div>
|
|
271
|
-
`, isInline: true, styles: [".backdrop{z-index:1999;position:absolute;inset:0;background-color:#0000004d}.spinner-circle,.spinner-circle:after{border-radius:50%;width:10em;height:10em}.spinner-circle{font-size:6px;border-top:1.1em solid rgba(255,255,255,.2);border-right:1.1em solid rgba(255,255,255,.2);border-bottom:1.1em solid rgba(255,255,255,.2);border-left:1.1em solid #ffffff;position:absolute;inset:0;margin:auto;z-index:2000;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation:load8 1.1s infinite linear;animation:load8 1.1s infinite linear}@-webkit-keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.spinner-circle-swish{font-size:60px;overflow:hidden;width:1em;height:1em;border-radius:50%;position:absolute;inset:0;margin:auto;z-index:2000;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation:load6 1.7s infinite ease;animation:load6 1.7s infinite ease}@-webkit-keyframes load6{0%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;-webkit-transform:rotate(0deg)}5%,95%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em}10%,59%{box-shadow:0 -.83em 0 -.4em,-.087em -.825em 0 -.42em,-.173em -.812em 0 -.44em,-.256em -.789em 0 -.46em,-.297em -.775em 0 -.477em}20%{box-shadow:0 -.83em 0 -.4em,-.338em -.758em 0 -.42em,-.555em -.617em 0 -.44em,-.671em -.488em 0 -.46em,-.749em -.34em 0 -.477em}38%{box-shadow:0 -.83em 0 -.4em,-.377em -.74em 0 -.42em,-.645em -.522em 0 -.44em,-.775em -.297em 0 -.46em,-.82em -.09em 0 -.477em}to{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;-webkit-transform:rotate(360deg)}}@keyframes load6{0%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;transform:rotate(0)}5%,95%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em}10%,59%{box-shadow:0 -.83em 0 -.4em,-.087em -.825em 0 -.42em,-.173em -.812em 0 -.44em,-.256em -.789em 0 -.46em,-.297em -.775em 0 -.477em}20%{box-shadow:0 -.83em 0 -.4em,-.338em -.758em 0 -.42em,-.555em -.617em 0 -.44em,-.671em -.488em 0 -.46em,-.749em -.34em 0 -.477em}38%{box-shadow:0 -.83em 0 -.4em,-.377em -.74em 0 -.42em,-.645em -.522em 0 -.44em,-.775em -.297em 0 -.46em,-.82em -.09em 0 -.477em}to{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;transform:rotate(360deg)}}.sk-cube-grid{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000}.sk-cube-grid .sk-cube{width:33%;height:33%;background-color:#333;float:left;-webkit-animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out;animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out}.sk-cube-grid .sk-cube1{-webkit-animation-delay:.2s;animation-delay:.2s}.sk-cube-grid .sk-cube2{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-cube-grid .sk-cube3{-webkit-animation-delay:.4s;animation-delay:.4s}.sk-cube-grid .sk-cube4{-webkit-animation-delay:.1s;animation-delay:.1s}.sk-cube-grid .sk-cube5{-webkit-animation-delay:.2s;animation-delay:.2s}.sk-cube-grid .sk-cube6{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-cube-grid .sk-cube7{-webkit-animation-delay:0s;animation-delay:0s}.sk-cube-grid .sk-cube8{-webkit-animation-delay:.1s;animation-delay:.1s}.sk-cube-grid .sk-cube9{-webkit-animation-delay:.2s;animation-delay:.2s}@-webkit-keyframes sk-cubeGridScaleDelay{0%,70%,to{-webkit-transform:scale3D(1,1,1);transform:scaleZ(1)}35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}}@keyframes sk-cubeGridScaleDelay{0%,70%,to{-webkit-transform:scale3D(1,1,1);transform:scaleZ(1)}35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}}.spinner-double-bounce{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000}.double-bounce1,.double-bounce2{width:100%;height:100%;border-radius:50%;background-color:#333;opacity:.6;position:absolute;top:0;left:0;-webkit-animation:sk-bounce 2s infinite ease-in-out;animation:sk-bounce 2s infinite ease-in-out}.double-bounce2{-webkit-animation-delay:-1s;animation-delay:-1s}.spinner-pulse{width:40px;height:40px;background-color:#333;position:absolute;inset:0;margin:auto;z-index:2000;border-radius:100%;-webkit-animation:sk-scaleout 1s infinite ease-in-out;animation:sk-scaleout 1s infinite ease-in-out}@-webkit-keyframes sk-scaleout{0%{-webkit-transform:scale(0)}to{-webkit-transform:scale(1);opacity:0}}@keyframes sk-scaleout{0%{-webkit-transform:scale(0);transform:scale(0)}to{-webkit-transform:scale(1);transform:scale(1);opacity:0}}.spinner-three-bounce{width:70px;text-align:center;position:absolute;inset:0;height:20px;margin:auto;z-index:2000}.spinner-three-bounce>div{width:18px;height:18px;background-color:#fff;border-radius:100%;display:inline-block;-webkit-animation:sk-bouncedelay 1.4s infinite ease-in-out both;animation:sk-bouncedelay 1.4s infinite ease-in-out both}.spinner-three-bounce .bounce1{-webkit-animation-delay:-.32s;animation-delay:-.32s}.spinner-three-bounce .bounce2{-webkit-animation-delay:-.16s;animation-delay:-.16s}@-webkit-keyframes sk-bouncedelay{0%,80%,to{-webkit-transform:scale(0)}40%{-webkit-transform:scale(1)}}@keyframes sk-bouncedelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.spinner-sk-rotateplane{width:40px;height:40px;background-color:#fff;text-align:center;position:absolute;inset:0;margin:auto;z-index:2000;-webkit-animation:sk-rotateplane 1.2s infinite ease-in-out;animation:sk-rotateplane 1.2s infinite ease-in-out}@-webkit-keyframes sk-rotateplane{0%{-webkit-transform:perspective(120px)}50%{-webkit-transform:perspective(120px) rotateY(180deg)}to{-webkit-transform:perspective(120px) rotateY(180deg) rotateX(180deg)}}@keyframes sk-rotateplane{0%{transform:perspective(120px) rotateX(0) rotateY(0);-webkit-transform:perspective(120px) rotateX(0deg) rotateY(0deg)}50%{transform:perspective(120px) rotateX(-180.1deg) rotateY(0);-webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg)}to{transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);-webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg)}}.spinner-rectangle-bounce{width:50px;height:40px;font-size:10px;text-align:center;position:absolute;inset:0;margin:auto;z-index:2000}.spinner-rectangle-bounce>div{background-color:#fff;height:100%;width:6px;display:inline-block;-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;animation:sk-stretchdelay 1.2s infinite ease-in-out}.spinner-rectangle-bounce .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.spinner-rectangle-bounce .rect3{-webkit-animation-delay:-1s;animation-delay:-1s}.spinner-rectangle-bounce .rect4{-webkit-animation-delay:-.9s;animation-delay:-.9s}.spinner-rectangle-bounce .rect5{-webkit-animation-delay:-.8s;animation-delay:-.8s}@-webkit-keyframes sk-stretchdelay{0%,40%,to{-webkit-transform:scaleY(.4)}20%{-webkit-transform:scaleY(1)}}@keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4);-webkit-transform:scaleY(.4)}20%{transform:scaleY(1);-webkit-transform:scaleY(1)}}.spinner-wandering-cubes{width:60px;height:58px;font-size:10px;text-align:center;position:absolute;inset:0;margin:auto;z-index:2000}.cube1,.cube2{background-color:#fff;width:15px;height:15px;position:absolute;top:0;left:0;-webkit-animation:sk-cubemove 1.8s infinite ease-in-out;animation:sk-cubemove 1.8s infinite ease-in-out}.cube2{-webkit-animation-delay:-.9s;animation-delay:-.9s}@-webkit-keyframes sk-cubemove{25%{-webkit-transform:translateX(42px) rotate(-90deg) scale(.5)}50%{-webkit-transform:translateX(42px) translateY(42px) rotate(-180deg)}75%{-webkit-transform:translateX(0px) translateY(42px) rotate(-270deg) scale(.5)}to{-webkit-transform:rotate(-360deg)}}@keyframes sk-cubemove{25%{transform:translate(42px) rotate(-90deg) scale(.5);-webkit-transform:translateX(42px) rotate(-90deg) scale(.5)}50%{transform:translate(42px) translateY(42px) rotate(-179deg);-webkit-transform:translateX(42px) translateY(42px) rotate(-179deg)}50.1%{transform:translate(42px) translateY(42px) rotate(-180deg);-webkit-transform:translateX(42px) translateY(42px) rotate(-180deg)}75%{transform:translate(0) translateY(42px) rotate(-270deg) scale(.5);-webkit-transform:translateX(0px) translateY(42px) rotate(-270deg) scale(.5)}to{transform:rotate(-360deg);-webkit-transform:rotate(-360deg)}}.sk-circle{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000}.sk-circle .sk-child{width:100%;height:100%;position:absolute;left:0;top:0}.sk-circle .sk-child:before{content:\"\";display:block;margin:0 auto;width:15%;height:15%;background-color:#333;border-radius:100%;-webkit-animation:sk-circleBounceDelay 1.2s infinite ease-in-out both;animation:sk-circleBounceDelay 1.2s infinite ease-in-out both}.sk-circle .sk-circle2{-webkit-transform:rotate(30deg);-ms-transform:rotate(30deg);transform:rotate(30deg)}.sk-circle .sk-circle3{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg)}.sk-circle .sk-circle4{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.sk-circle .sk-circle5{-webkit-transform:rotate(120deg);-ms-transform:rotate(120deg);transform:rotate(120deg)}.sk-circle .sk-circle6{-webkit-transform:rotate(150deg);-ms-transform:rotate(150deg);transform:rotate(150deg)}.sk-circle .sk-circle7{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.sk-circle .sk-circle8{-webkit-transform:rotate(210deg);-ms-transform:rotate(210deg);transform:rotate(210deg)}.sk-circle .sk-circle9{-webkit-transform:rotate(240deg);-ms-transform:rotate(240deg);transform:rotate(240deg)}.sk-circle .sk-circle10{-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.sk-circle .sk-circle11{-webkit-transform:rotate(300deg);-ms-transform:rotate(300deg);transform:rotate(300deg)}.sk-circle .sk-circle12{-webkit-transform:rotate(330deg);-ms-transform:rotate(330deg);transform:rotate(330deg)}.sk-circle .sk-circle2:before{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-circle .sk-circle3:before{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-circle .sk-circle4:before{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-circle .sk-circle5:before{-webkit-animation-delay:-.8s;animation-delay:-.8s}.sk-circle .sk-circle6:before{-webkit-animation-delay:-.7s;animation-delay:-.7s}.sk-circle .sk-circle7:before{-webkit-animation-delay:-.6s;animation-delay:-.6s}.sk-circle .sk-circle8:before{-webkit-animation-delay:-.5s;animation-delay:-.5s}.sk-circle .sk-circle9:before{-webkit-animation-delay:-.4s;animation-delay:-.4s}.sk-circle .sk-circle10:before{-webkit-animation-delay:-.3s;animation-delay:-.3s}.sk-circle .sk-circle11:before{-webkit-animation-delay:-.2s;animation-delay:-.2s}.sk-circle .sk-circle12:before{-webkit-animation-delay:-.1s;animation-delay:-.1s}@-webkit-keyframes sk-circleBounceDelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes sk-circleBounceDelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.spinner-chasing-dots{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000;text-align:center;-webkit-animation:sk-rotate 2s infinite linear;animation:sk-rotate 2s infinite linear}.dot1,.dot2{width:60%;height:60%;display:inline-block;position:absolute;top:0;background-color:#333;border-radius:100%;-webkit-animation:sk-bounce 2s infinite ease-in-out;animation:sk-bounce 2s infinite ease-in-out}.dot2{top:auto;bottom:0;-webkit-animation-delay:-1s;animation-delay:-1s}@-webkit-keyframes sk-rotate{to{-webkit-transform:rotate(360deg)}}@keyframes sk-rotate{to{transform:rotate(360deg);-webkit-transform:rotate(360deg)}}@-webkit-keyframes sk-bounce{0%,to{-webkit-transform:scale(0)}50%{-webkit-transform:scale(1)}}@keyframes sk-bounce{0%,to{transform:scale(0);-webkit-transform:scale(0)}50%{transform:scale(1);-webkit-transform:scale(1)}}.full-screen{position:fixed;position:-ms-page}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }] }); }
|
|
81
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: NgxLoadingComponent, deps: [{ token: NgxLoadingService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
82
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.4", type: NgxLoadingComponent, isStandalone: true, selector: "ngx-loading", inputs: { show: "show", config: "config", template: "template" }, ngImport: i0, template: "@if (show) {\n<div class=\"backdrop\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\" [ngStyle]=\"{\n 'border-radius': config.backdropBorderRadius,\n 'background-color': config.backdropBackgroundColour\n }\"></div>\n\n@switch (config.animationType) {\n@case (ngxLoadingAnimationTypes.circle) {\n<div class=\"spinner-circle\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\" [ngStyle]=\"{\n 'border-top-color': config.secondaryColour,\n 'border-right-color': config.secondaryColour,\n 'border-bottom-color': config.secondaryColour,\n 'border-left-color': config.primaryColour\n }\"></div>\n}\n\n@case (ngxLoadingAnimationTypes.cubeGrid) {\n<div class=\"sk-cube-grid\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"sk-cube sk-cube1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube2\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube3\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube4\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube5\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube6\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube7\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube8\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube9\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.rotatingPlane) {\n<div class=\"spinner-sk-rotateplane\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"></div>\n}\n\n@case (ngxLoadingAnimationTypes.rectangleBounce) {\n<div class=\"spinner-rectangle-bounce\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"rect1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"rect2\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"rect3\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"rect4\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"rect5\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.wanderingCubes) {\n<div class=\"spinner-wandering-cubes\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"cube1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"cube2\" [ngStyle]=\"{ 'background-color': config.secondaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.doubleBounce) {\n<div class=\"spinner-double-bounce\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"double-bounce1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"double-bounce2\" [ngStyle]=\"{ 'background-color': config.secondaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.pulse) {\n<div class=\"spinner-pulse\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n}\n\n@case (ngxLoadingAnimationTypes.chasingDots) {\n<div class=\"spinner-chasing-dots\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"dot1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"dot2\" [ngStyle]=\"{ 'background-color': config.secondaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.circleSwish) {\n<div class=\"spinner-circle-swish\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n [ngStyle]=\"{ color: config.primaryColour }\"></div>\n}\n\n@case (ngxLoadingAnimationTypes.none) {\n<div [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"></div>\n}\n\n@default {\n<div class=\"spinner-three-bounce\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"bounce1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"bounce2\" [ngStyle]=\"{ 'background-color': config.secondaryColour }\"></div>\n <div class=\"bounce3\" [ngStyle]=\"{ 'background-color': config.tertiaryColour }\"></div>\n</div>\n}\n}\n\n@if (template) {\n<ng-container>\n <ng-container *ngTemplateOutlet=\"template\"></ng-container>\n</ng-container>\n}\n}", styles: [".backdrop{z-index:1999;position:absolute;inset:0;background-color:#0000004d}.spinner-circle,.spinner-circle:after{border-radius:50%;width:10em;height:10em}.spinner-circle{font-size:6px;border-top:1.1em solid rgba(255,255,255,.2);border-right:1.1em solid rgba(255,255,255,.2);border-bottom:1.1em solid rgba(255,255,255,.2);border-left:1.1em solid #ffffff;position:absolute;inset:0;margin:auto;z-index:2000;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation:load8 1.1s infinite linear;animation:load8 1.1s infinite linear}@-webkit-keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.spinner-circle-swish{font-size:60px;overflow:hidden;width:1em;height:1em;border-radius:50%;position:absolute;inset:0;margin:auto;z-index:2000;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation:load6 1.7s infinite ease;animation:load6 1.7s infinite ease}@-webkit-keyframes load6{0%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;-webkit-transform:rotate(0deg)}5%,95%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em}10%,59%{box-shadow:0 -.83em 0 -.4em,-.087em -.825em 0 -.42em,-.173em -.812em 0 -.44em,-.256em -.789em 0 -.46em,-.297em -.775em 0 -.477em}20%{box-shadow:0 -.83em 0 -.4em,-.338em -.758em 0 -.42em,-.555em -.617em 0 -.44em,-.671em -.488em 0 -.46em,-.749em -.34em 0 -.477em}38%{box-shadow:0 -.83em 0 -.4em,-.377em -.74em 0 -.42em,-.645em -.522em 0 -.44em,-.775em -.297em 0 -.46em,-.82em -.09em 0 -.477em}to{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;-webkit-transform:rotate(360deg)}}@keyframes load6{0%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;transform:rotate(0)}5%,95%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em}10%,59%{box-shadow:0 -.83em 0 -.4em,-.087em -.825em 0 -.42em,-.173em -.812em 0 -.44em,-.256em -.789em 0 -.46em,-.297em -.775em 0 -.477em}20%{box-shadow:0 -.83em 0 -.4em,-.338em -.758em 0 -.42em,-.555em -.617em 0 -.44em,-.671em -.488em 0 -.46em,-.749em -.34em 0 -.477em}38%{box-shadow:0 -.83em 0 -.4em,-.377em -.74em 0 -.42em,-.645em -.522em 0 -.44em,-.775em -.297em 0 -.46em,-.82em -.09em 0 -.477em}to{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;transform:rotate(360deg)}}.sk-cube-grid{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000}.sk-cube-grid .sk-cube{width:33%;height:33%;background-color:#333;float:left;-webkit-animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out;animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out}.sk-cube-grid .sk-cube1{-webkit-animation-delay:.2s;animation-delay:.2s}.sk-cube-grid .sk-cube2{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-cube-grid .sk-cube3{-webkit-animation-delay:.4s;animation-delay:.4s}.sk-cube-grid .sk-cube4{-webkit-animation-delay:.1s;animation-delay:.1s}.sk-cube-grid .sk-cube5{-webkit-animation-delay:.2s;animation-delay:.2s}.sk-cube-grid .sk-cube6{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-cube-grid .sk-cube7{-webkit-animation-delay:0s;animation-delay:0s}.sk-cube-grid .sk-cube8{-webkit-animation-delay:.1s;animation-delay:.1s}.sk-cube-grid .sk-cube9{-webkit-animation-delay:.2s;animation-delay:.2s}@-webkit-keyframes sk-cubeGridScaleDelay{0%,70%,to{-webkit-transform:scale3D(1,1,1);transform:scaleZ(1)}35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}}@keyframes sk-cubeGridScaleDelay{0%,70%,to{-webkit-transform:scale3D(1,1,1);transform:scaleZ(1)}35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}}.spinner-double-bounce{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000}.double-bounce1,.double-bounce2{width:100%;height:100%;border-radius:50%;background-color:#333;opacity:.6;position:absolute;top:0;left:0;-webkit-animation:sk-bounce 2s infinite ease-in-out;animation:sk-bounce 2s infinite ease-in-out}.double-bounce2{-webkit-animation-delay:-1s;animation-delay:-1s}.spinner-pulse{width:40px;height:40px;background-color:#333;position:absolute;inset:0;margin:auto;z-index:2000;border-radius:100%;-webkit-animation:sk-scaleout 1s infinite ease-in-out;animation:sk-scaleout 1s infinite ease-in-out}@-webkit-keyframes sk-scaleout{0%{-webkit-transform:scale(0)}to{-webkit-transform:scale(1);opacity:0}}@keyframes sk-scaleout{0%{-webkit-transform:scale(0);transform:scale(0)}to{-webkit-transform:scale(1);transform:scale(1);opacity:0}}.spinner-three-bounce{width:70px;text-align:center;position:absolute;inset:0;height:20px;margin:auto;z-index:2000}.spinner-three-bounce>div{width:18px;height:18px;background-color:#fff;border-radius:100%;display:inline-block;-webkit-animation:sk-bouncedelay 1.4s infinite ease-in-out both;animation:sk-bouncedelay 1.4s infinite ease-in-out both}.spinner-three-bounce .bounce1{-webkit-animation-delay:-.32s;animation-delay:-.32s}.spinner-three-bounce .bounce2{-webkit-animation-delay:-.16s;animation-delay:-.16s}@-webkit-keyframes sk-bouncedelay{0%,80%,to{-webkit-transform:scale(0)}40%{-webkit-transform:scale(1)}}@keyframes sk-bouncedelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.spinner-sk-rotateplane{width:40px;height:40px;background-color:#fff;text-align:center;position:absolute;inset:0;margin:auto;z-index:2000;-webkit-animation:sk-rotateplane 1.2s infinite ease-in-out;animation:sk-rotateplane 1.2s infinite ease-in-out}@-webkit-keyframes sk-rotateplane{0%{-webkit-transform:perspective(120px)}50%{-webkit-transform:perspective(120px) rotateY(180deg)}to{-webkit-transform:perspective(120px) rotateY(180deg) rotateX(180deg)}}@keyframes sk-rotateplane{0%{transform:perspective(120px) rotateX(0) rotateY(0);-webkit-transform:perspective(120px) rotateX(0deg) rotateY(0deg)}50%{transform:perspective(120px) rotateX(-180.1deg) rotateY(0);-webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg)}to{transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);-webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg)}}.spinner-rectangle-bounce{width:50px;height:40px;font-size:10px;text-align:center;position:absolute;inset:0;margin:auto;z-index:2000}.spinner-rectangle-bounce>div{background-color:#fff;height:100%;width:6px;display:inline-block;-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;animation:sk-stretchdelay 1.2s infinite ease-in-out}.spinner-rectangle-bounce .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.spinner-rectangle-bounce .rect3{-webkit-animation-delay:-1s;animation-delay:-1s}.spinner-rectangle-bounce .rect4{-webkit-animation-delay:-.9s;animation-delay:-.9s}.spinner-rectangle-bounce .rect5{-webkit-animation-delay:-.8s;animation-delay:-.8s}@-webkit-keyframes sk-stretchdelay{0%,40%,to{-webkit-transform:scaleY(.4)}20%{-webkit-transform:scaleY(1)}}@keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4);-webkit-transform:scaleY(.4)}20%{transform:scaleY(1);-webkit-transform:scaleY(1)}}.spinner-wandering-cubes{width:60px;height:58px;font-size:10px;text-align:center;position:absolute;inset:0;margin:auto;z-index:2000}.cube1,.cube2{background-color:#fff;width:15px;height:15px;position:absolute;top:0;left:0;-webkit-animation:sk-cubemove 1.8s infinite ease-in-out;animation:sk-cubemove 1.8s infinite ease-in-out}.cube2{-webkit-animation-delay:-.9s;animation-delay:-.9s}@-webkit-keyframes sk-cubemove{25%{-webkit-transform:translateX(42px) rotate(-90deg) scale(.5)}50%{-webkit-transform:translateX(42px) translateY(42px) rotate(-180deg)}75%{-webkit-transform:translateX(0px) translateY(42px) rotate(-270deg) scale(.5)}to{-webkit-transform:rotate(-360deg)}}@keyframes sk-cubemove{25%{transform:translate(42px) rotate(-90deg) scale(.5);-webkit-transform:translateX(42px) rotate(-90deg) scale(.5)}50%{transform:translate(42px) translateY(42px) rotate(-179deg);-webkit-transform:translateX(42px) translateY(42px) rotate(-179deg)}50.1%{transform:translate(42px) translateY(42px) rotate(-180deg);-webkit-transform:translateX(42px) translateY(42px) rotate(-180deg)}75%{transform:translate(0) translateY(42px) rotate(-270deg) scale(.5);-webkit-transform:translateX(0px) translateY(42px) rotate(-270deg) scale(.5)}to{transform:rotate(-360deg);-webkit-transform:rotate(-360deg)}}.sk-circle{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000}.sk-circle .sk-child{width:100%;height:100%;position:absolute;left:0;top:0}.sk-circle .sk-child:before{content:\"\";display:block;margin:0 auto;width:15%;height:15%;background-color:#333;border-radius:100%;-webkit-animation:sk-circleBounceDelay 1.2s infinite ease-in-out both;animation:sk-circleBounceDelay 1.2s infinite ease-in-out both}.sk-circle .sk-circle2{-webkit-transform:rotate(30deg);-ms-transform:rotate(30deg);transform:rotate(30deg)}.sk-circle .sk-circle3{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg)}.sk-circle .sk-circle4{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.sk-circle .sk-circle5{-webkit-transform:rotate(120deg);-ms-transform:rotate(120deg);transform:rotate(120deg)}.sk-circle .sk-circle6{-webkit-transform:rotate(150deg);-ms-transform:rotate(150deg);transform:rotate(150deg)}.sk-circle .sk-circle7{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.sk-circle .sk-circle8{-webkit-transform:rotate(210deg);-ms-transform:rotate(210deg);transform:rotate(210deg)}.sk-circle .sk-circle9{-webkit-transform:rotate(240deg);-ms-transform:rotate(240deg);transform:rotate(240deg)}.sk-circle .sk-circle10{-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.sk-circle .sk-circle11{-webkit-transform:rotate(300deg);-ms-transform:rotate(300deg);transform:rotate(300deg)}.sk-circle .sk-circle12{-webkit-transform:rotate(330deg);-ms-transform:rotate(330deg);transform:rotate(330deg)}.sk-circle .sk-circle2:before{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-circle .sk-circle3:before{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-circle .sk-circle4:before{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-circle .sk-circle5:before{-webkit-animation-delay:-.8s;animation-delay:-.8s}.sk-circle .sk-circle6:before{-webkit-animation-delay:-.7s;animation-delay:-.7s}.sk-circle .sk-circle7:before{-webkit-animation-delay:-.6s;animation-delay:-.6s}.sk-circle .sk-circle8:before{-webkit-animation-delay:-.5s;animation-delay:-.5s}.sk-circle .sk-circle9:before{-webkit-animation-delay:-.4s;animation-delay:-.4s}.sk-circle .sk-circle10:before{-webkit-animation-delay:-.3s;animation-delay:-.3s}.sk-circle .sk-circle11:before{-webkit-animation-delay:-.2s;animation-delay:-.2s}.sk-circle .sk-circle12:before{-webkit-animation-delay:-.1s;animation-delay:-.1s}@-webkit-keyframes sk-circleBounceDelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes sk-circleBounceDelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.spinner-chasing-dots{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000;text-align:center;-webkit-animation:sk-rotate 2s infinite linear;animation:sk-rotate 2s infinite linear}.dot1,.dot2{width:60%;height:60%;display:inline-block;position:absolute;top:0;background-color:#333;border-radius:100%;-webkit-animation:sk-bounce 2s infinite ease-in-out;animation:sk-bounce 2s infinite ease-in-out}.dot2{top:auto;bottom:0;-webkit-animation-delay:-1s;animation-delay:-1s}@-webkit-keyframes sk-rotate{to{-webkit-transform:rotate(360deg)}}@keyframes sk-rotate{to{transform:rotate(360deg);-webkit-transform:rotate(360deg)}}@-webkit-keyframes sk-bounce{0%,to{-webkit-transform:scale(0)}50%{-webkit-transform:scale(1)}}@keyframes sk-bounce{0%,to{transform:scale(0);-webkit-transform:scale(0)}50%{transform:scale(1);-webkit-transform:scale(1)}}.full-screen{position:fixed;position:-ms-page}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
272
83
|
}
|
|
273
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
84
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: NgxLoadingComponent, decorators: [{
|
|
274
85
|
type: Component,
|
|
275
|
-
args: [{ selector: 'ngx-loading', template: `
|
|
276
|
-
<div *ngIf="show">
|
|
277
|
-
<div
|
|
278
|
-
class="backdrop"
|
|
279
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
280
|
-
[ngStyle]="{
|
|
281
|
-
'border-radius': config.backdropBorderRadius,
|
|
282
|
-
'background-color': config.backdropBackgroundColour
|
|
283
|
-
}"
|
|
284
|
-
></div>
|
|
285
|
-
|
|
286
|
-
<div [ngSwitch]="config.animationType">
|
|
287
|
-
<div
|
|
288
|
-
class="spinner-circle"
|
|
289
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.circle"
|
|
290
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
291
|
-
[ngStyle]="{
|
|
292
|
-
'border-top-color': config.secondaryColour,
|
|
293
|
-
'border-right-color': config.secondaryColour,
|
|
294
|
-
'border-bottom-color': config.secondaryColour,
|
|
295
|
-
'border-left-color': config.primaryColour
|
|
296
|
-
}"
|
|
297
|
-
></div>
|
|
298
|
-
|
|
299
|
-
<div
|
|
300
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.cubeGrid"
|
|
301
|
-
class="sk-cube-grid"
|
|
302
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
303
|
-
>
|
|
304
|
-
<div
|
|
305
|
-
class="sk-cube sk-cube1"
|
|
306
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
307
|
-
></div>
|
|
308
|
-
<div
|
|
309
|
-
class="sk-cube sk-cube2"
|
|
310
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
311
|
-
></div>
|
|
312
|
-
<div
|
|
313
|
-
class="sk-cube sk-cube3"
|
|
314
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
315
|
-
></div>
|
|
316
|
-
<div
|
|
317
|
-
class="sk-cube sk-cube4"
|
|
318
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
319
|
-
></div>
|
|
320
|
-
<div
|
|
321
|
-
class="sk-cube sk-cube5"
|
|
322
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
323
|
-
></div>
|
|
324
|
-
<div
|
|
325
|
-
class="sk-cube sk-cube6"
|
|
326
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
327
|
-
></div>
|
|
328
|
-
<div
|
|
329
|
-
class="sk-cube sk-cube7"
|
|
330
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
331
|
-
></div>
|
|
332
|
-
<div
|
|
333
|
-
class="sk-cube sk-cube8"
|
|
334
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
335
|
-
></div>
|
|
336
|
-
<div
|
|
337
|
-
class="sk-cube sk-cube9"
|
|
338
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
339
|
-
></div>
|
|
340
|
-
</div>
|
|
341
|
-
|
|
342
|
-
<div
|
|
343
|
-
class="spinner-sk-rotateplane"
|
|
344
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.rotatingPlane"
|
|
345
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
346
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
347
|
-
></div>
|
|
348
|
-
|
|
349
|
-
<div
|
|
350
|
-
class="spinner-rectangle-bounce"
|
|
351
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.rectangleBounce"
|
|
352
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
353
|
-
>
|
|
354
|
-
<div
|
|
355
|
-
class="rect1"
|
|
356
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
357
|
-
></div>
|
|
358
|
-
<div
|
|
359
|
-
class="rect2"
|
|
360
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
361
|
-
></div>
|
|
362
|
-
<div
|
|
363
|
-
class="rect3"
|
|
364
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
365
|
-
></div>
|
|
366
|
-
<div
|
|
367
|
-
class="rect4"
|
|
368
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
369
|
-
></div>
|
|
370
|
-
<div
|
|
371
|
-
class="rect5"
|
|
372
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
373
|
-
></div>
|
|
374
|
-
</div>
|
|
375
|
-
|
|
376
|
-
<div
|
|
377
|
-
class="spinner-wandering-cubes"
|
|
378
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.wanderingCubes"
|
|
379
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
380
|
-
>
|
|
381
|
-
<div
|
|
382
|
-
class="cube1"
|
|
383
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
384
|
-
></div>
|
|
385
|
-
<div
|
|
386
|
-
class="cube2"
|
|
387
|
-
[ngStyle]="{ 'background-color': config.secondaryColour }"
|
|
388
|
-
></div>
|
|
389
|
-
</div>
|
|
390
|
-
|
|
391
|
-
<div
|
|
392
|
-
class="spinner-double-bounce"
|
|
393
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.doubleBounce"
|
|
394
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
395
|
-
>
|
|
396
|
-
<div
|
|
397
|
-
class="double-bounce1"
|
|
398
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
399
|
-
></div>
|
|
400
|
-
<div
|
|
401
|
-
class="double-bounce2"
|
|
402
|
-
[ngStyle]="{ 'background-color': config.secondaryColour }"
|
|
403
|
-
></div>
|
|
404
|
-
</div>
|
|
405
|
-
|
|
406
|
-
<div
|
|
407
|
-
class="spinner-pulse"
|
|
408
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.pulse"
|
|
409
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
410
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
411
|
-
></div>
|
|
412
|
-
|
|
413
|
-
<div
|
|
414
|
-
class="spinner-chasing-dots"
|
|
415
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.chasingDots"
|
|
416
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
417
|
-
>
|
|
418
|
-
<div
|
|
419
|
-
class="dot1"
|
|
420
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
421
|
-
></div>
|
|
422
|
-
<div
|
|
423
|
-
class="dot2"
|
|
424
|
-
[ngStyle]="{ 'background-color': config.secondaryColour }"
|
|
425
|
-
></div>
|
|
426
|
-
</div>
|
|
427
|
-
|
|
428
|
-
<div
|
|
429
|
-
class="spinner-circle-swish"
|
|
430
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.circleSwish"
|
|
431
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
432
|
-
[ngStyle]="{ color: config.primaryColour }"
|
|
433
|
-
></div>
|
|
434
|
-
|
|
435
|
-
<div
|
|
436
|
-
*ngSwitchCase="ngxLoadingAnimationTypes.none"
|
|
437
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
438
|
-
></div>
|
|
439
|
-
|
|
440
|
-
<div
|
|
441
|
-
*ngSwitchDefault
|
|
442
|
-
class="spinner-three-bounce"
|
|
443
|
-
[ngClass]="{ 'full-screen': config.fullScreenBackdrop === true }"
|
|
444
|
-
>
|
|
445
|
-
<div
|
|
446
|
-
class="bounce1"
|
|
447
|
-
[ngStyle]="{ 'background-color': config.primaryColour }"
|
|
448
|
-
></div>
|
|
449
|
-
<div
|
|
450
|
-
class="bounce2"
|
|
451
|
-
[ngStyle]="{ 'background-color': config.secondaryColour }"
|
|
452
|
-
></div>
|
|
453
|
-
<div
|
|
454
|
-
class="bounce3"
|
|
455
|
-
[ngStyle]="{ 'background-color': config.tertiaryColour }"
|
|
456
|
-
></div>
|
|
457
|
-
</div>
|
|
458
|
-
|
|
459
|
-
<ng-container *ngIf="template">
|
|
460
|
-
<ng-container *ngTemplateOutlet="template"></ng-container>
|
|
461
|
-
</ng-container>
|
|
462
|
-
</div>
|
|
463
|
-
</div>
|
|
464
|
-
`, imports: [CommonModule], styles: [".backdrop{z-index:1999;position:absolute;inset:0;background-color:#0000004d}.spinner-circle,.spinner-circle:after{border-radius:50%;width:10em;height:10em}.spinner-circle{font-size:6px;border-top:1.1em solid rgba(255,255,255,.2);border-right:1.1em solid rgba(255,255,255,.2);border-bottom:1.1em solid rgba(255,255,255,.2);border-left:1.1em solid #ffffff;position:absolute;inset:0;margin:auto;z-index:2000;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation:load8 1.1s infinite linear;animation:load8 1.1s infinite linear}@-webkit-keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.spinner-circle-swish{font-size:60px;overflow:hidden;width:1em;height:1em;border-radius:50%;position:absolute;inset:0;margin:auto;z-index:2000;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation:load6 1.7s infinite ease;animation:load6 1.7s infinite ease}@-webkit-keyframes load6{0%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;-webkit-transform:rotate(0deg)}5%,95%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em}10%,59%{box-shadow:0 -.83em 0 -.4em,-.087em -.825em 0 -.42em,-.173em -.812em 0 -.44em,-.256em -.789em 0 -.46em,-.297em -.775em 0 -.477em}20%{box-shadow:0 -.83em 0 -.4em,-.338em -.758em 0 -.42em,-.555em -.617em 0 -.44em,-.671em -.488em 0 -.46em,-.749em -.34em 0 -.477em}38%{box-shadow:0 -.83em 0 -.4em,-.377em -.74em 0 -.42em,-.645em -.522em 0 -.44em,-.775em -.297em 0 -.46em,-.82em -.09em 0 -.477em}to{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;-webkit-transform:rotate(360deg)}}@keyframes load6{0%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;transform:rotate(0)}5%,95%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em}10%,59%{box-shadow:0 -.83em 0 -.4em,-.087em -.825em 0 -.42em,-.173em -.812em 0 -.44em,-.256em -.789em 0 -.46em,-.297em -.775em 0 -.477em}20%{box-shadow:0 -.83em 0 -.4em,-.338em -.758em 0 -.42em,-.555em -.617em 0 -.44em,-.671em -.488em 0 -.46em,-.749em -.34em 0 -.477em}38%{box-shadow:0 -.83em 0 -.4em,-.377em -.74em 0 -.42em,-.645em -.522em 0 -.44em,-.775em -.297em 0 -.46em,-.82em -.09em 0 -.477em}to{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;transform:rotate(360deg)}}.sk-cube-grid{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000}.sk-cube-grid .sk-cube{width:33%;height:33%;background-color:#333;float:left;-webkit-animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out;animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out}.sk-cube-grid .sk-cube1{-webkit-animation-delay:.2s;animation-delay:.2s}.sk-cube-grid .sk-cube2{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-cube-grid .sk-cube3{-webkit-animation-delay:.4s;animation-delay:.4s}.sk-cube-grid .sk-cube4{-webkit-animation-delay:.1s;animation-delay:.1s}.sk-cube-grid .sk-cube5{-webkit-animation-delay:.2s;animation-delay:.2s}.sk-cube-grid .sk-cube6{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-cube-grid .sk-cube7{-webkit-animation-delay:0s;animation-delay:0s}.sk-cube-grid .sk-cube8{-webkit-animation-delay:.1s;animation-delay:.1s}.sk-cube-grid .sk-cube9{-webkit-animation-delay:.2s;animation-delay:.2s}@-webkit-keyframes sk-cubeGridScaleDelay{0%,70%,to{-webkit-transform:scale3D(1,1,1);transform:scaleZ(1)}35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}}@keyframes sk-cubeGridScaleDelay{0%,70%,to{-webkit-transform:scale3D(1,1,1);transform:scaleZ(1)}35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}}.spinner-double-bounce{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000}.double-bounce1,.double-bounce2{width:100%;height:100%;border-radius:50%;background-color:#333;opacity:.6;position:absolute;top:0;left:0;-webkit-animation:sk-bounce 2s infinite ease-in-out;animation:sk-bounce 2s infinite ease-in-out}.double-bounce2{-webkit-animation-delay:-1s;animation-delay:-1s}.spinner-pulse{width:40px;height:40px;background-color:#333;position:absolute;inset:0;margin:auto;z-index:2000;border-radius:100%;-webkit-animation:sk-scaleout 1s infinite ease-in-out;animation:sk-scaleout 1s infinite ease-in-out}@-webkit-keyframes sk-scaleout{0%{-webkit-transform:scale(0)}to{-webkit-transform:scale(1);opacity:0}}@keyframes sk-scaleout{0%{-webkit-transform:scale(0);transform:scale(0)}to{-webkit-transform:scale(1);transform:scale(1);opacity:0}}.spinner-three-bounce{width:70px;text-align:center;position:absolute;inset:0;height:20px;margin:auto;z-index:2000}.spinner-three-bounce>div{width:18px;height:18px;background-color:#fff;border-radius:100%;display:inline-block;-webkit-animation:sk-bouncedelay 1.4s infinite ease-in-out both;animation:sk-bouncedelay 1.4s infinite ease-in-out both}.spinner-three-bounce .bounce1{-webkit-animation-delay:-.32s;animation-delay:-.32s}.spinner-three-bounce .bounce2{-webkit-animation-delay:-.16s;animation-delay:-.16s}@-webkit-keyframes sk-bouncedelay{0%,80%,to{-webkit-transform:scale(0)}40%{-webkit-transform:scale(1)}}@keyframes sk-bouncedelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.spinner-sk-rotateplane{width:40px;height:40px;background-color:#fff;text-align:center;position:absolute;inset:0;margin:auto;z-index:2000;-webkit-animation:sk-rotateplane 1.2s infinite ease-in-out;animation:sk-rotateplane 1.2s infinite ease-in-out}@-webkit-keyframes sk-rotateplane{0%{-webkit-transform:perspective(120px)}50%{-webkit-transform:perspective(120px) rotateY(180deg)}to{-webkit-transform:perspective(120px) rotateY(180deg) rotateX(180deg)}}@keyframes sk-rotateplane{0%{transform:perspective(120px) rotateX(0) rotateY(0);-webkit-transform:perspective(120px) rotateX(0deg) rotateY(0deg)}50%{transform:perspective(120px) rotateX(-180.1deg) rotateY(0);-webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg)}to{transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);-webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg)}}.spinner-rectangle-bounce{width:50px;height:40px;font-size:10px;text-align:center;position:absolute;inset:0;margin:auto;z-index:2000}.spinner-rectangle-bounce>div{background-color:#fff;height:100%;width:6px;display:inline-block;-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;animation:sk-stretchdelay 1.2s infinite ease-in-out}.spinner-rectangle-bounce .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.spinner-rectangle-bounce .rect3{-webkit-animation-delay:-1s;animation-delay:-1s}.spinner-rectangle-bounce .rect4{-webkit-animation-delay:-.9s;animation-delay:-.9s}.spinner-rectangle-bounce .rect5{-webkit-animation-delay:-.8s;animation-delay:-.8s}@-webkit-keyframes sk-stretchdelay{0%,40%,to{-webkit-transform:scaleY(.4)}20%{-webkit-transform:scaleY(1)}}@keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4);-webkit-transform:scaleY(.4)}20%{transform:scaleY(1);-webkit-transform:scaleY(1)}}.spinner-wandering-cubes{width:60px;height:58px;font-size:10px;text-align:center;position:absolute;inset:0;margin:auto;z-index:2000}.cube1,.cube2{background-color:#fff;width:15px;height:15px;position:absolute;top:0;left:0;-webkit-animation:sk-cubemove 1.8s infinite ease-in-out;animation:sk-cubemove 1.8s infinite ease-in-out}.cube2{-webkit-animation-delay:-.9s;animation-delay:-.9s}@-webkit-keyframes sk-cubemove{25%{-webkit-transform:translateX(42px) rotate(-90deg) scale(.5)}50%{-webkit-transform:translateX(42px) translateY(42px) rotate(-180deg)}75%{-webkit-transform:translateX(0px) translateY(42px) rotate(-270deg) scale(.5)}to{-webkit-transform:rotate(-360deg)}}@keyframes sk-cubemove{25%{transform:translate(42px) rotate(-90deg) scale(.5);-webkit-transform:translateX(42px) rotate(-90deg) scale(.5)}50%{transform:translate(42px) translateY(42px) rotate(-179deg);-webkit-transform:translateX(42px) translateY(42px) rotate(-179deg)}50.1%{transform:translate(42px) translateY(42px) rotate(-180deg);-webkit-transform:translateX(42px) translateY(42px) rotate(-180deg)}75%{transform:translate(0) translateY(42px) rotate(-270deg) scale(.5);-webkit-transform:translateX(0px) translateY(42px) rotate(-270deg) scale(.5)}to{transform:rotate(-360deg);-webkit-transform:rotate(-360deg)}}.sk-circle{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000}.sk-circle .sk-child{width:100%;height:100%;position:absolute;left:0;top:0}.sk-circle .sk-child:before{content:\"\";display:block;margin:0 auto;width:15%;height:15%;background-color:#333;border-radius:100%;-webkit-animation:sk-circleBounceDelay 1.2s infinite ease-in-out both;animation:sk-circleBounceDelay 1.2s infinite ease-in-out both}.sk-circle .sk-circle2{-webkit-transform:rotate(30deg);-ms-transform:rotate(30deg);transform:rotate(30deg)}.sk-circle .sk-circle3{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg)}.sk-circle .sk-circle4{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.sk-circle .sk-circle5{-webkit-transform:rotate(120deg);-ms-transform:rotate(120deg);transform:rotate(120deg)}.sk-circle .sk-circle6{-webkit-transform:rotate(150deg);-ms-transform:rotate(150deg);transform:rotate(150deg)}.sk-circle .sk-circle7{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.sk-circle .sk-circle8{-webkit-transform:rotate(210deg);-ms-transform:rotate(210deg);transform:rotate(210deg)}.sk-circle .sk-circle9{-webkit-transform:rotate(240deg);-ms-transform:rotate(240deg);transform:rotate(240deg)}.sk-circle .sk-circle10{-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.sk-circle .sk-circle11{-webkit-transform:rotate(300deg);-ms-transform:rotate(300deg);transform:rotate(300deg)}.sk-circle .sk-circle12{-webkit-transform:rotate(330deg);-ms-transform:rotate(330deg);transform:rotate(330deg)}.sk-circle .sk-circle2:before{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-circle .sk-circle3:before{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-circle .sk-circle4:before{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-circle .sk-circle5:before{-webkit-animation-delay:-.8s;animation-delay:-.8s}.sk-circle .sk-circle6:before{-webkit-animation-delay:-.7s;animation-delay:-.7s}.sk-circle .sk-circle7:before{-webkit-animation-delay:-.6s;animation-delay:-.6s}.sk-circle .sk-circle8:before{-webkit-animation-delay:-.5s;animation-delay:-.5s}.sk-circle .sk-circle9:before{-webkit-animation-delay:-.4s;animation-delay:-.4s}.sk-circle .sk-circle10:before{-webkit-animation-delay:-.3s;animation-delay:-.3s}.sk-circle .sk-circle11:before{-webkit-animation-delay:-.2s;animation-delay:-.2s}.sk-circle .sk-circle12:before{-webkit-animation-delay:-.1s;animation-delay:-.1s}@-webkit-keyframes sk-circleBounceDelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes sk-circleBounceDelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.spinner-chasing-dots{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000;text-align:center;-webkit-animation:sk-rotate 2s infinite linear;animation:sk-rotate 2s infinite linear}.dot1,.dot2{width:60%;height:60%;display:inline-block;position:absolute;top:0;background-color:#333;border-radius:100%;-webkit-animation:sk-bounce 2s infinite ease-in-out;animation:sk-bounce 2s infinite ease-in-out}.dot2{top:auto;bottom:0;-webkit-animation-delay:-1s;animation-delay:-1s}@-webkit-keyframes sk-rotate{to{-webkit-transform:rotate(360deg)}}@keyframes sk-rotate{to{transform:rotate(360deg);-webkit-transform:rotate(360deg)}}@-webkit-keyframes sk-bounce{0%,to{-webkit-transform:scale(0)}50%{-webkit-transform:scale(1)}}@keyframes sk-bounce{0%,to{transform:scale(0);-webkit-transform:scale(0)}50%{transform:scale(1);-webkit-transform:scale(1)}}.full-screen{position:fixed;position:-ms-page}\n"] }]
|
|
86
|
+
args: [{ selector: 'ngx-loading', imports: [CommonModule], template: "@if (show) {\n<div class=\"backdrop\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\" [ngStyle]=\"{\n 'border-radius': config.backdropBorderRadius,\n 'background-color': config.backdropBackgroundColour\n }\"></div>\n\n@switch (config.animationType) {\n@case (ngxLoadingAnimationTypes.circle) {\n<div class=\"spinner-circle\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\" [ngStyle]=\"{\n 'border-top-color': config.secondaryColour,\n 'border-right-color': config.secondaryColour,\n 'border-bottom-color': config.secondaryColour,\n 'border-left-color': config.primaryColour\n }\"></div>\n}\n\n@case (ngxLoadingAnimationTypes.cubeGrid) {\n<div class=\"sk-cube-grid\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"sk-cube sk-cube1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube2\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube3\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube4\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube5\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube6\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube7\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube8\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube9\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.rotatingPlane) {\n<div class=\"spinner-sk-rotateplane\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"></div>\n}\n\n@case (ngxLoadingAnimationTypes.rectangleBounce) {\n<div class=\"spinner-rectangle-bounce\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"rect1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"rect2\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"rect3\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"rect4\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"rect5\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.wanderingCubes) {\n<div class=\"spinner-wandering-cubes\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"cube1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"cube2\" [ngStyle]=\"{ 'background-color': config.secondaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.doubleBounce) {\n<div class=\"spinner-double-bounce\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"double-bounce1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"double-bounce2\" [ngStyle]=\"{ 'background-color': config.secondaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.pulse) {\n<div class=\"spinner-pulse\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n}\n\n@case (ngxLoadingAnimationTypes.chasingDots) {\n<div class=\"spinner-chasing-dots\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"dot1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"dot2\" [ngStyle]=\"{ 'background-color': config.secondaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.circleSwish) {\n<div class=\"spinner-circle-swish\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n [ngStyle]=\"{ color: config.primaryColour }\"></div>\n}\n\n@case (ngxLoadingAnimationTypes.none) {\n<div [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"></div>\n}\n\n@default {\n<div class=\"spinner-three-bounce\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"bounce1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"bounce2\" [ngStyle]=\"{ 'background-color': config.secondaryColour }\"></div>\n <div class=\"bounce3\" [ngStyle]=\"{ 'background-color': config.tertiaryColour }\"></div>\n</div>\n}\n}\n\n@if (template) {\n<ng-container>\n <ng-container *ngTemplateOutlet=\"template\"></ng-container>\n</ng-container>\n}\n}", styles: [".backdrop{z-index:1999;position:absolute;inset:0;background-color:#0000004d}.spinner-circle,.spinner-circle:after{border-radius:50%;width:10em;height:10em}.spinner-circle{font-size:6px;border-top:1.1em solid rgba(255,255,255,.2);border-right:1.1em solid rgba(255,255,255,.2);border-bottom:1.1em solid rgba(255,255,255,.2);border-left:1.1em solid #ffffff;position:absolute;inset:0;margin:auto;z-index:2000;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation:load8 1.1s infinite linear;animation:load8 1.1s infinite linear}@-webkit-keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.spinner-circle-swish{font-size:60px;overflow:hidden;width:1em;height:1em;border-radius:50%;position:absolute;inset:0;margin:auto;z-index:2000;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation:load6 1.7s infinite ease;animation:load6 1.7s infinite ease}@-webkit-keyframes load6{0%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;-webkit-transform:rotate(0deg)}5%,95%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em}10%,59%{box-shadow:0 -.83em 0 -.4em,-.087em -.825em 0 -.42em,-.173em -.812em 0 -.44em,-.256em -.789em 0 -.46em,-.297em -.775em 0 -.477em}20%{box-shadow:0 -.83em 0 -.4em,-.338em -.758em 0 -.42em,-.555em -.617em 0 -.44em,-.671em -.488em 0 -.46em,-.749em -.34em 0 -.477em}38%{box-shadow:0 -.83em 0 -.4em,-.377em -.74em 0 -.42em,-.645em -.522em 0 -.44em,-.775em -.297em 0 -.46em,-.82em -.09em 0 -.477em}to{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;-webkit-transform:rotate(360deg)}}@keyframes load6{0%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;transform:rotate(0)}5%,95%{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em}10%,59%{box-shadow:0 -.83em 0 -.4em,-.087em -.825em 0 -.42em,-.173em -.812em 0 -.44em,-.256em -.789em 0 -.46em,-.297em -.775em 0 -.477em}20%{box-shadow:0 -.83em 0 -.4em,-.338em -.758em 0 -.42em,-.555em -.617em 0 -.44em,-.671em -.488em 0 -.46em,-.749em -.34em 0 -.477em}38%{box-shadow:0 -.83em 0 -.4em,-.377em -.74em 0 -.42em,-.645em -.522em 0 -.44em,-.775em -.297em 0 -.46em,-.82em -.09em 0 -.477em}to{box-shadow:0 -.83em 0 -.4em,0 -.83em 0 -.42em,0 -.83em 0 -.44em,0 -.83em 0 -.46em,0 -.83em 0 -.477em;transform:rotate(360deg)}}.sk-cube-grid{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000}.sk-cube-grid .sk-cube{width:33%;height:33%;background-color:#333;float:left;-webkit-animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out;animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out}.sk-cube-grid .sk-cube1{-webkit-animation-delay:.2s;animation-delay:.2s}.sk-cube-grid .sk-cube2{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-cube-grid .sk-cube3{-webkit-animation-delay:.4s;animation-delay:.4s}.sk-cube-grid .sk-cube4{-webkit-animation-delay:.1s;animation-delay:.1s}.sk-cube-grid .sk-cube5{-webkit-animation-delay:.2s;animation-delay:.2s}.sk-cube-grid .sk-cube6{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-cube-grid .sk-cube7{-webkit-animation-delay:0s;animation-delay:0s}.sk-cube-grid .sk-cube8{-webkit-animation-delay:.1s;animation-delay:.1s}.sk-cube-grid .sk-cube9{-webkit-animation-delay:.2s;animation-delay:.2s}@-webkit-keyframes sk-cubeGridScaleDelay{0%,70%,to{-webkit-transform:scale3D(1,1,1);transform:scaleZ(1)}35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}}@keyframes sk-cubeGridScaleDelay{0%,70%,to{-webkit-transform:scale3D(1,1,1);transform:scaleZ(1)}35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}}.spinner-double-bounce{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000}.double-bounce1,.double-bounce2{width:100%;height:100%;border-radius:50%;background-color:#333;opacity:.6;position:absolute;top:0;left:0;-webkit-animation:sk-bounce 2s infinite ease-in-out;animation:sk-bounce 2s infinite ease-in-out}.double-bounce2{-webkit-animation-delay:-1s;animation-delay:-1s}.spinner-pulse{width:40px;height:40px;background-color:#333;position:absolute;inset:0;margin:auto;z-index:2000;border-radius:100%;-webkit-animation:sk-scaleout 1s infinite ease-in-out;animation:sk-scaleout 1s infinite ease-in-out}@-webkit-keyframes sk-scaleout{0%{-webkit-transform:scale(0)}to{-webkit-transform:scale(1);opacity:0}}@keyframes sk-scaleout{0%{-webkit-transform:scale(0);transform:scale(0)}to{-webkit-transform:scale(1);transform:scale(1);opacity:0}}.spinner-three-bounce{width:70px;text-align:center;position:absolute;inset:0;height:20px;margin:auto;z-index:2000}.spinner-three-bounce>div{width:18px;height:18px;background-color:#fff;border-radius:100%;display:inline-block;-webkit-animation:sk-bouncedelay 1.4s infinite ease-in-out both;animation:sk-bouncedelay 1.4s infinite ease-in-out both}.spinner-three-bounce .bounce1{-webkit-animation-delay:-.32s;animation-delay:-.32s}.spinner-three-bounce .bounce2{-webkit-animation-delay:-.16s;animation-delay:-.16s}@-webkit-keyframes sk-bouncedelay{0%,80%,to{-webkit-transform:scale(0)}40%{-webkit-transform:scale(1)}}@keyframes sk-bouncedelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.spinner-sk-rotateplane{width:40px;height:40px;background-color:#fff;text-align:center;position:absolute;inset:0;margin:auto;z-index:2000;-webkit-animation:sk-rotateplane 1.2s infinite ease-in-out;animation:sk-rotateplane 1.2s infinite ease-in-out}@-webkit-keyframes sk-rotateplane{0%{-webkit-transform:perspective(120px)}50%{-webkit-transform:perspective(120px) rotateY(180deg)}to{-webkit-transform:perspective(120px) rotateY(180deg) rotateX(180deg)}}@keyframes sk-rotateplane{0%{transform:perspective(120px) rotateX(0) rotateY(0);-webkit-transform:perspective(120px) rotateX(0deg) rotateY(0deg)}50%{transform:perspective(120px) rotateX(-180.1deg) rotateY(0);-webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg)}to{transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);-webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg)}}.spinner-rectangle-bounce{width:50px;height:40px;font-size:10px;text-align:center;position:absolute;inset:0;margin:auto;z-index:2000}.spinner-rectangle-bounce>div{background-color:#fff;height:100%;width:6px;display:inline-block;-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;animation:sk-stretchdelay 1.2s infinite ease-in-out}.spinner-rectangle-bounce .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.spinner-rectangle-bounce .rect3{-webkit-animation-delay:-1s;animation-delay:-1s}.spinner-rectangle-bounce .rect4{-webkit-animation-delay:-.9s;animation-delay:-.9s}.spinner-rectangle-bounce .rect5{-webkit-animation-delay:-.8s;animation-delay:-.8s}@-webkit-keyframes sk-stretchdelay{0%,40%,to{-webkit-transform:scaleY(.4)}20%{-webkit-transform:scaleY(1)}}@keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4);-webkit-transform:scaleY(.4)}20%{transform:scaleY(1);-webkit-transform:scaleY(1)}}.spinner-wandering-cubes{width:60px;height:58px;font-size:10px;text-align:center;position:absolute;inset:0;margin:auto;z-index:2000}.cube1,.cube2{background-color:#fff;width:15px;height:15px;position:absolute;top:0;left:0;-webkit-animation:sk-cubemove 1.8s infinite ease-in-out;animation:sk-cubemove 1.8s infinite ease-in-out}.cube2{-webkit-animation-delay:-.9s;animation-delay:-.9s}@-webkit-keyframes sk-cubemove{25%{-webkit-transform:translateX(42px) rotate(-90deg) scale(.5)}50%{-webkit-transform:translateX(42px) translateY(42px) rotate(-180deg)}75%{-webkit-transform:translateX(0px) translateY(42px) rotate(-270deg) scale(.5)}to{-webkit-transform:rotate(-360deg)}}@keyframes sk-cubemove{25%{transform:translate(42px) rotate(-90deg) scale(.5);-webkit-transform:translateX(42px) rotate(-90deg) scale(.5)}50%{transform:translate(42px) translateY(42px) rotate(-179deg);-webkit-transform:translateX(42px) translateY(42px) rotate(-179deg)}50.1%{transform:translate(42px) translateY(42px) rotate(-180deg);-webkit-transform:translateX(42px) translateY(42px) rotate(-180deg)}75%{transform:translate(0) translateY(42px) rotate(-270deg) scale(.5);-webkit-transform:translateX(0px) translateY(42px) rotate(-270deg) scale(.5)}to{transform:rotate(-360deg);-webkit-transform:rotate(-360deg)}}.sk-circle{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000}.sk-circle .sk-child{width:100%;height:100%;position:absolute;left:0;top:0}.sk-circle .sk-child:before{content:\"\";display:block;margin:0 auto;width:15%;height:15%;background-color:#333;border-radius:100%;-webkit-animation:sk-circleBounceDelay 1.2s infinite ease-in-out both;animation:sk-circleBounceDelay 1.2s infinite ease-in-out both}.sk-circle .sk-circle2{-webkit-transform:rotate(30deg);-ms-transform:rotate(30deg);transform:rotate(30deg)}.sk-circle .sk-circle3{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg)}.sk-circle .sk-circle4{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.sk-circle .sk-circle5{-webkit-transform:rotate(120deg);-ms-transform:rotate(120deg);transform:rotate(120deg)}.sk-circle .sk-circle6{-webkit-transform:rotate(150deg);-ms-transform:rotate(150deg);transform:rotate(150deg)}.sk-circle .sk-circle7{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.sk-circle .sk-circle8{-webkit-transform:rotate(210deg);-ms-transform:rotate(210deg);transform:rotate(210deg)}.sk-circle .sk-circle9{-webkit-transform:rotate(240deg);-ms-transform:rotate(240deg);transform:rotate(240deg)}.sk-circle .sk-circle10{-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.sk-circle .sk-circle11{-webkit-transform:rotate(300deg);-ms-transform:rotate(300deg);transform:rotate(300deg)}.sk-circle .sk-circle12{-webkit-transform:rotate(330deg);-ms-transform:rotate(330deg);transform:rotate(330deg)}.sk-circle .sk-circle2:before{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-circle .sk-circle3:before{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-circle .sk-circle4:before{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-circle .sk-circle5:before{-webkit-animation-delay:-.8s;animation-delay:-.8s}.sk-circle .sk-circle6:before{-webkit-animation-delay:-.7s;animation-delay:-.7s}.sk-circle .sk-circle7:before{-webkit-animation-delay:-.6s;animation-delay:-.6s}.sk-circle .sk-circle8:before{-webkit-animation-delay:-.5s;animation-delay:-.5s}.sk-circle .sk-circle9:before{-webkit-animation-delay:-.4s;animation-delay:-.4s}.sk-circle .sk-circle10:before{-webkit-animation-delay:-.3s;animation-delay:-.3s}.sk-circle .sk-circle11:before{-webkit-animation-delay:-.2s;animation-delay:-.2s}.sk-circle .sk-circle12:before{-webkit-animation-delay:-.1s;animation-delay:-.1s}@-webkit-keyframes sk-circleBounceDelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes sk-circleBounceDelay{0%,80%,to{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.spinner-chasing-dots{width:40px;height:40px;position:absolute;inset:0;margin:auto;z-index:2000;text-align:center;-webkit-animation:sk-rotate 2s infinite linear;animation:sk-rotate 2s infinite linear}.dot1,.dot2{width:60%;height:60%;display:inline-block;position:absolute;top:0;background-color:#333;border-radius:100%;-webkit-animation:sk-bounce 2s infinite ease-in-out;animation:sk-bounce 2s infinite ease-in-out}.dot2{top:auto;bottom:0;-webkit-animation-delay:-1s;animation-delay:-1s}@-webkit-keyframes sk-rotate{to{-webkit-transform:rotate(360deg)}}@keyframes sk-rotate{to{transform:rotate(360deg);-webkit-transform:rotate(360deg)}}@-webkit-keyframes sk-bounce{0%,to{-webkit-transform:scale(0)}50%{-webkit-transform:scale(1)}}@keyframes sk-bounce{0%,to{transform:scale(0);-webkit-transform:scale(0)}50%{transform:scale(1);-webkit-transform:scale(1)}}.full-screen{position:fixed;position:-ms-page}\n"] }]
|
|
465
87
|
}], ctorParameters: () => [{ type: NgxLoadingService }], propDecorators: { show: [{
|
|
466
88
|
type: Input
|
|
467
89
|
}], config: [{
|
|
@@ -477,11 +99,11 @@ class NgxLoadingModule {
|
|
|
477
99
|
providers: [{ provide: 'loadingConfig', useValue: loadingConfig }],
|
|
478
100
|
};
|
|
479
101
|
}
|
|
480
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
481
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
482
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
102
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: NgxLoadingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
103
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.4", ngImport: i0, type: NgxLoadingModule, imports: [NgxLoadingComponent], exports: [NgxLoadingComponent] }); }
|
|
104
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: NgxLoadingModule, imports: [NgxLoadingComponent] }); }
|
|
483
105
|
}
|
|
484
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
106
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: NgxLoadingModule, decorators: [{
|
|
485
107
|
type: NgModule,
|
|
486
108
|
args: [{
|
|
487
109
|
imports: [NgxLoadingComponent],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngx-loading-fork.mjs","sources":["../../../projects/ngx-loading/src/lib/ngx-loading-config.ts","../../../projects/ngx-loading/src/lib/ngx-loading.service.ts","../../../projects/ngx-loading/src/lib/ngx-loading.component.ts","../../../projects/ngx-loading/src/lib/ngx-loading.module.ts","../../../projects/ngx-loading/src/public-api.ts","../../../projects/ngx-loading/src/ngx-loading-fork.ts"],"sourcesContent":["export interface INgxLoadingConfig {\n backdropBorderRadius?: string;\n backdropBackgroundColour?: string;\n fullScreenBackdrop?: boolean;\n animationType?: string;\n primaryColour?: string;\n secondaryColour?: string;\n tertiaryColour?: string;\n [key: string]: string | boolean | undefined;\n}\n\nexport class NgxLoadingConfig implements INgxLoadingConfig {\n backdropBorderRadius?: string;\n backdropBackgroundColour?: string;\n fullScreenBackdrop?: boolean;\n animationType?: string;\n primaryColour?: string;\n secondaryColour?: string;\n tertiaryColour?: string;\n [key: string]: string | boolean | undefined;\n\n constructor(config: INgxLoadingConfig = {}) {\n this.backdropBorderRadius = config.backdropBorderRadius;\n this.backdropBackgroundColour = config.backdropBackgroundColour;\n this.fullScreenBackdrop = config.fullScreenBackdrop;\n this.animationType = config.animationType;\n this.primaryColour = config.primaryColour;\n this.secondaryColour = config.secondaryColour;\n this.tertiaryColour = config.tertiaryColour;\n }\n}\n\nexport const ngxLoadingAnimationTypes = {\n chasingDots: 'chasing-dots',\n circle: 'sk-circle',\n circleSwish: 'circleSwish',\n cubeGrid: 'sk-cube-grid',\n doubleBounce: 'double-bounce',\n none: 'none',\n pulse: 'pulse',\n rectangleBounce: 'rectangle-bounce',\n rotatingPlane: 'rotating-plane',\n threeBounce: 'three-bounce',\n wanderingCubes: 'wandering-cubes',\n};\n","import { Inject, Injectable, Optional } from '@angular/core';\nimport type { INgxLoadingConfig} from './ngx-loading-config';\nimport { NgxLoadingConfig } from './ngx-loading-config';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class NgxLoadingService {\n public loadingConfig: INgxLoadingConfig;\n\n constructor(\n @Optional() @Inject('loadingConfig') private config: INgxLoadingConfig\n ) {\n this.loadingConfig = this.config || new NgxLoadingConfig();\n }\n}\n","import { OnInit, TemplateRef } from '@angular/core';\nimport { Component, Input } from '@angular/core';\nimport {\n ngxLoadingAnimationTypes,\n NgxLoadingConfig,\n} from './ngx-loading-config';\nimport { INgxLoadingConfig } from './ngx-loading-config';\nimport { NgxLoadingService } from './ngx-loading.service';\nimport { CommonModule } from '@angular/common';\n\n@Component({\n selector: 'ngx-loading',\n template: `\n <div *ngIf=\"show\">\n <div\n class=\"backdrop\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n [ngStyle]=\"{\n 'border-radius': config.backdropBorderRadius,\n 'background-color': config.backdropBackgroundColour\n }\"\n ></div>\n\n <div [ngSwitch]=\"config.animationType\">\n <div\n class=\"spinner-circle\"\n *ngSwitchCase=\"ngxLoadingAnimationTypes.circle\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n [ngStyle]=\"{\n 'border-top-color': config.secondaryColour,\n 'border-right-color': config.secondaryColour,\n 'border-bottom-color': config.secondaryColour,\n 'border-left-color': config.primaryColour\n }\"\n ></div>\n\n <div\n *ngSwitchCase=\"ngxLoadingAnimationTypes.cubeGrid\"\n class=\"sk-cube-grid\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n >\n <div\n class=\"sk-cube sk-cube1\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"sk-cube sk-cube2\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"sk-cube sk-cube3\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"sk-cube sk-cube4\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"sk-cube sk-cube5\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"sk-cube sk-cube6\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"sk-cube sk-cube7\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"sk-cube sk-cube8\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"sk-cube sk-cube9\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n </div>\n\n <div\n class=\"spinner-sk-rotateplane\"\n *ngSwitchCase=\"ngxLoadingAnimationTypes.rotatingPlane\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n ></div>\n\n <div\n class=\"spinner-rectangle-bounce\"\n *ngSwitchCase=\"ngxLoadingAnimationTypes.rectangleBounce\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n >\n <div\n class=\"rect1\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"rect2\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"rect3\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"rect4\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"rect5\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n </div>\n\n <div\n class=\"spinner-wandering-cubes\"\n *ngSwitchCase=\"ngxLoadingAnimationTypes.wanderingCubes\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n >\n <div\n class=\"cube1\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"cube2\"\n [ngStyle]=\"{ 'background-color': config.secondaryColour }\"\n ></div>\n </div>\n\n <div\n class=\"spinner-double-bounce\"\n *ngSwitchCase=\"ngxLoadingAnimationTypes.doubleBounce\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n >\n <div\n class=\"double-bounce1\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"double-bounce2\"\n [ngStyle]=\"{ 'background-color': config.secondaryColour }\"\n ></div>\n </div>\n\n <div\n class=\"spinner-pulse\"\n *ngSwitchCase=\"ngxLoadingAnimationTypes.pulse\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n\n <div\n class=\"spinner-chasing-dots\"\n *ngSwitchCase=\"ngxLoadingAnimationTypes.chasingDots\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n >\n <div\n class=\"dot1\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"dot2\"\n [ngStyle]=\"{ 'background-color': config.secondaryColour }\"\n ></div>\n </div>\n\n <div\n class=\"spinner-circle-swish\"\n *ngSwitchCase=\"ngxLoadingAnimationTypes.circleSwish\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n [ngStyle]=\"{ color: config.primaryColour }\"\n ></div>\n\n <div\n *ngSwitchCase=\"ngxLoadingAnimationTypes.none\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n ></div>\n\n <div\n *ngSwitchDefault\n class=\"spinner-three-bounce\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n >\n <div\n class=\"bounce1\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n ></div>\n <div\n class=\"bounce2\"\n [ngStyle]=\"{ 'background-color': config.secondaryColour }\"\n ></div>\n <div\n class=\"bounce3\"\n [ngStyle]=\"{ 'background-color': config.tertiaryColour }\"\n ></div>\n </div>\n\n <ng-container *ngIf=\"template\">\n <ng-container *ngTemplateOutlet=\"template\"></ng-container>\n </ng-container>\n </div>\n </div>\n `,\n styles: [\n `\n .backdrop {\n z-index: 1999;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(0, 0, 0, 0.3);\n }\n\n /* Spinner Circle styles */\n .spinner-circle,\n .spinner-circle:after {\n border-radius: 50%;\n width: 10em;\n height: 10em;\n }\n\n .spinner-circle {\n font-size: 6px;\n border-top: 1.1em solid rgba(255, 255, 255, 0.2);\n border-right: 1.1em solid rgba(255, 255, 255, 0.2);\n border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);\n border-left: 1.1em solid #ffffff;\n margin: auto;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n -webkit-transform: translateZ(0);\n -ms-transform: translateZ(0);\n transform: translateZ(0);\n -webkit-animation: load8 1.1s infinite linear;\n animation: load8 1.1s infinite linear;\n }\n @-webkit-keyframes load8 {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n }\n @keyframes load8 {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n }\n\n /* Circle Swish styles */\n .spinner-circle-swish {\n font-size: 60px;\n overflow: hidden;\n width: 1em;\n height: 1em;\n z-index: 2000;\n border-radius: 50%;\n margin: auto;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n -webkit-transform: translateZ(0);\n -ms-transform: translateZ(0);\n transform: translateZ(0);\n -webkit-animation: load6 1.7s infinite ease;\n animation: load6 1.7s infinite ease;\n }\n @-webkit-keyframes load6 {\n 0% {\n box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em,\n 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;\n\n -webkit-transform: rotate(0deg);\n }\n 5%,\n 95% {\n box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em,\n 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;\n }\n 10%,\n 59% {\n box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em,\n -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em,\n -0.297em -0.775em 0 -0.477em;\n }\n 20% {\n box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em,\n -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em,\n -0.749em -0.34em 0 -0.477em;\n }\n 38% {\n box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em,\n -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em,\n -0.82em -0.09em 0 -0.477em;\n }\n 100% {\n box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em,\n 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;\n\n -webkit-transform: rotate(360deg);\n }\n }\n @keyframes load6 {\n 0% {\n box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em,\n 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;\n\n transform: rotate(0deg);\n }\n 5%,\n 95% {\n box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em,\n 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;\n }\n 10%,\n 59% {\n box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em,\n -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em,\n -0.297em -0.775em 0 -0.477em;\n }\n 20% {\n box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em,\n -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em,\n -0.749em -0.34em 0 -0.477em;\n }\n 38% {\n box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em,\n -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em,\n -0.82em -0.09em 0 -0.477em;\n }\n 100% {\n box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em,\n 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;\n\n transform: rotate(360deg);\n }\n }\n\n /* Cube Grid styles */\n .sk-cube-grid {\n width: 40px;\n height: 40px;\n\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n }\n\n .sk-cube-grid .sk-cube {\n width: 33%;\n height: 33%;\n background-color: #333;\n float: left;\n -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;\n animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;\n }\n\n .sk-cube-grid .sk-cube1 {\n -webkit-animation-delay: 0.2s;\n animation-delay: 0.2s;\n }\n\n .sk-cube-grid .sk-cube2 {\n -webkit-animation-delay: 0.3s;\n animation-delay: 0.3s;\n }\n\n .sk-cube-grid .sk-cube3 {\n -webkit-animation-delay: 0.4s;\n animation-delay: 0.4s;\n }\n\n .sk-cube-grid .sk-cube4 {\n -webkit-animation-delay: 0.1s;\n animation-delay: 0.1s;\n }\n\n .sk-cube-grid .sk-cube5 {\n -webkit-animation-delay: 0.2s;\n animation-delay: 0.2s;\n }\n\n .sk-cube-grid .sk-cube6 {\n -webkit-animation-delay: 0.3s;\n animation-delay: 0.3s;\n }\n\n .sk-cube-grid .sk-cube7 {\n -webkit-animation-delay: 0s;\n animation-delay: 0s;\n }\n\n .sk-cube-grid .sk-cube8 {\n -webkit-animation-delay: 0.1s;\n animation-delay: 0.1s;\n }\n\n .sk-cube-grid .sk-cube9 {\n -webkit-animation-delay: 0.2s;\n animation-delay: 0.2s;\n }\n\n @-webkit-keyframes sk-cubeGridScaleDelay {\n 0%,\n 70%,\n 100% {\n -webkit-transform: scale3D(1, 1, 1);\n transform: scale3D(1, 1, 1);\n }\n 35% {\n -webkit-transform: scale3D(0, 0, 1);\n transform: scale3D(0, 0, 1);\n }\n }\n\n @keyframes sk-cubeGridScaleDelay {\n 0%,\n 70%,\n 100% {\n -webkit-transform: scale3D(1, 1, 1);\n transform: scale3D(1, 1, 1);\n }\n 35% {\n -webkit-transform: scale3D(0, 0, 1);\n transform: scale3D(0, 0, 1);\n }\n }\n\n /* Double Bounce styles */\n .spinner-double-bounce {\n width: 40px;\n height: 40px;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n }\n\n .double-bounce1,\n .double-bounce2 {\n width: 100%;\n height: 100%;\n border-radius: 50%;\n background-color: #333;\n opacity: 0.6;\n position: absolute;\n top: 0;\n left: 0;\n -webkit-animation: sk-bounce 2s infinite ease-in-out;\n animation: sk-bounce 2s infinite ease-in-out;\n }\n\n .double-bounce2 {\n -webkit-animation-delay: -1s;\n animation-delay: -1s;\n }\n\n @-webkit-keyframes sk-bounce {\n 0%,\n 100% {\n -webkit-transform: scale(0);\n }\n 50% {\n -webkit-transform: scale(1);\n }\n }\n\n @keyframes sk-bounce {\n 0%,\n 100% {\n transform: scale(0);\n -webkit-transform: scale(0);\n }\n 50% {\n transform: scale(1);\n -webkit-transform: scale(1);\n }\n }\n\n /* Pulse styles */\n .spinner-pulse {\n width: 40px;\n height: 40px;\n background-color: #333;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n border-radius: 100%;\n -webkit-animation: sk-scaleout 1s infinite ease-in-out;\n animation: sk-scaleout 1s infinite ease-in-out;\n }\n\n @-webkit-keyframes sk-scaleout {\n 0% {\n -webkit-transform: scale(0);\n }\n 100% {\n -webkit-transform: scale(1);\n opacity: 0;\n }\n }\n\n @keyframes sk-scaleout {\n 0% {\n -webkit-transform: scale(0);\n transform: scale(0);\n }\n 100% {\n -webkit-transform: scale(1);\n transform: scale(1);\n opacity: 0;\n }\n }\n\n /* Three Bounce styles */\n .spinner-three-bounce {\n width: 70px;\n text-align: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n height: 20px;\n margin: auto;\n z-index: 2000;\n }\n\n .spinner-three-bounce > div {\n width: 18px;\n height: 18px;\n background-color: #ffffff;\n\n border-radius: 100%;\n display: inline-block;\n -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;\n animation: sk-bouncedelay 1.4s infinite ease-in-out both;\n }\n\n .spinner-three-bounce .bounce1 {\n -webkit-animation-delay: -0.32s;\n animation-delay: -0.32s;\n }\n\n .spinner-three-bounce .bounce2 {\n -webkit-animation-delay: -0.16s;\n animation-delay: -0.16s;\n }\n\n @-webkit-keyframes sk-bouncedelay {\n 0%,\n 80%,\n 100% {\n -webkit-transform: scale(0);\n }\n 40% {\n -webkit-transform: scale(1);\n }\n }\n\n @keyframes sk-bouncedelay {\n 0%,\n 80%,\n 100% {\n -webkit-transform: scale(0);\n transform: scale(0);\n }\n 40% {\n -webkit-transform: scale(1);\n transform: scale(1);\n }\n }\n\n /* Rotate Plane styles */\n .spinner-sk-rotateplane {\n width: 40px;\n height: 40px;\n background-color: #ffffff;\n text-align: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;\n animation: sk-rotateplane 1.2s infinite ease-in-out;\n }\n\n @-webkit-keyframes sk-rotateplane {\n 0% {\n -webkit-transform: perspective(120px);\n }\n 50% {\n -webkit-transform: perspective(120px) rotateY(180deg);\n }\n 100% {\n -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg);\n }\n }\n\n @keyframes sk-rotateplane {\n 0% {\n transform: perspective(120px) rotateX(0deg) rotateY(0deg);\n -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);\n }\n 50% {\n transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);\n -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);\n }\n 100% {\n transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);\n -webkit-transform: perspective(120px) rotateX(-180deg)\n rotateY(-179.9deg);\n }\n }\n\n /* Rectangle Bounce styles*/\n .spinner-rectangle-bounce {\n width: 50px;\n height: 40px;\n font-size: 10px;\n text-align: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n }\n\n .spinner-rectangle-bounce > div {\n background-color: #ffffff;\n height: 100%;\n width: 6px;\n display: inline-block;\n -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;\n animation: sk-stretchdelay 1.2s infinite ease-in-out;\n }\n\n .spinner-rectangle-bounce .rect2 {\n -webkit-animation-delay: -1.1s;\n animation-delay: -1.1s;\n }\n\n .spinner-rectangle-bounce .rect3 {\n -webkit-animation-delay: -1s;\n animation-delay: -1s;\n }\n\n .spinner-rectangle-bounce .rect4 {\n -webkit-animation-delay: -0.9s;\n animation-delay: -0.9s;\n }\n\n .spinner-rectangle-bounce .rect5 {\n -webkit-animation-delay: -0.8s;\n animation-delay: -0.8s;\n }\n\n @-webkit-keyframes sk-stretchdelay {\n 0%,\n 40%,\n 100% {\n -webkit-transform: scaleY(0.4);\n }\n 20% {\n -webkit-transform: scaleY(1);\n }\n }\n\n @keyframes sk-stretchdelay {\n 0%,\n 40%,\n 100% {\n transform: scaleY(0.4);\n -webkit-transform: scaleY(0.4);\n }\n 20% {\n transform: scaleY(1);\n -webkit-transform: scaleY(1);\n }\n }\n\n /* Wandering Cubes styles */\n .spinner-wandering-cubes {\n width: 60px;\n height: 58px;\n font-size: 10px;\n text-align: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n }\n\n .cube1,\n .cube2 {\n background-color: #ffffff;\n width: 15px;\n height: 15px;\n position: absolute;\n top: 0;\n left: 0;\n -webkit-animation: sk-cubemove 1.8s infinite ease-in-out;\n animation: sk-cubemove 1.8s infinite ease-in-out;\n }\n\n .cube2 {\n -webkit-animation-delay: -0.9s;\n animation-delay: -0.9s;\n }\n\n @-webkit-keyframes sk-cubemove {\n 25% {\n -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);\n }\n 50% {\n -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);\n }\n 75% {\n -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg)\n scale(0.5);\n }\n 100% {\n -webkit-transform: rotate(-360deg);\n }\n }\n\n @keyframes sk-cubemove {\n 25% {\n transform: translateX(42px) rotate(-90deg) scale(0.5);\n -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);\n }\n 50% {\n transform: translateX(42px) translateY(42px) rotate(-179deg);\n -webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);\n }\n 50.1% {\n transform: translateX(42px) translateY(42px) rotate(-180deg);\n -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);\n }\n 75% {\n transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);\n -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg)\n scale(0.5);\n }\n 100% {\n transform: rotate(-360deg);\n -webkit-transform: rotate(-360deg);\n }\n }\n\n /* Circle styles */\n .sk-circle {\n width: 40px;\n height: 40px;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n }\n .sk-circle .sk-child {\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0;\n top: 0;\n }\n .sk-circle .sk-child:before {\n content: '';\n display: block;\n margin: 0 auto;\n width: 15%;\n height: 15%;\n background-color: #333;\n border-radius: 100%;\n -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;\n animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;\n }\n .sk-circle .sk-circle2 {\n -webkit-transform: rotate(30deg);\n -ms-transform: rotate(30deg);\n transform: rotate(30deg);\n }\n .sk-circle .sk-circle3 {\n -webkit-transform: rotate(60deg);\n -ms-transform: rotate(60deg);\n transform: rotate(60deg);\n }\n .sk-circle .sk-circle4 {\n -webkit-transform: rotate(90deg);\n -ms-transform: rotate(90deg);\n transform: rotate(90deg);\n }\n .sk-circle .sk-circle5 {\n -webkit-transform: rotate(120deg);\n -ms-transform: rotate(120deg);\n transform: rotate(120deg);\n }\n .sk-circle .sk-circle6 {\n -webkit-transform: rotate(150deg);\n -ms-transform: rotate(150deg);\n transform: rotate(150deg);\n }\n .sk-circle .sk-circle7 {\n -webkit-transform: rotate(180deg);\n -ms-transform: rotate(180deg);\n transform: rotate(180deg);\n }\n .sk-circle .sk-circle8 {\n -webkit-transform: rotate(210deg);\n -ms-transform: rotate(210deg);\n transform: rotate(210deg);\n }\n .sk-circle .sk-circle9 {\n -webkit-transform: rotate(240deg);\n -ms-transform: rotate(240deg);\n transform: rotate(240deg);\n }\n .sk-circle .sk-circle10 {\n -webkit-transform: rotate(270deg);\n -ms-transform: rotate(270deg);\n transform: rotate(270deg);\n }\n .sk-circle .sk-circle11 {\n -webkit-transform: rotate(300deg);\n -ms-transform: rotate(300deg);\n transform: rotate(300deg);\n }\n .sk-circle .sk-circle12 {\n -webkit-transform: rotate(330deg);\n -ms-transform: rotate(330deg);\n transform: rotate(330deg);\n }\n .sk-circle .sk-circle2:before {\n -webkit-animation-delay: -1.1s;\n animation-delay: -1.1s;\n }\n .sk-circle .sk-circle3:before {\n -webkit-animation-delay: -1s;\n animation-delay: -1s;\n }\n .sk-circle .sk-circle4:before {\n -webkit-animation-delay: -0.9s;\n animation-delay: -0.9s;\n }\n .sk-circle .sk-circle5:before {\n -webkit-animation-delay: -0.8s;\n animation-delay: -0.8s;\n }\n .sk-circle .sk-circle6:before {\n -webkit-animation-delay: -0.7s;\n animation-delay: -0.7s;\n }\n .sk-circle .sk-circle7:before {\n -webkit-animation-delay: -0.6s;\n animation-delay: -0.6s;\n }\n .sk-circle .sk-circle8:before {\n -webkit-animation-delay: -0.5s;\n animation-delay: -0.5s;\n }\n .sk-circle .sk-circle9:before {\n -webkit-animation-delay: -0.4s;\n animation-delay: -0.4s;\n }\n .sk-circle .sk-circle10:before {\n -webkit-animation-delay: -0.3s;\n animation-delay: -0.3s;\n }\n .sk-circle .sk-circle11:before {\n -webkit-animation-delay: -0.2s;\n animation-delay: -0.2s;\n }\n .sk-circle .sk-circle12:before {\n -webkit-animation-delay: -0.1s;\n animation-delay: -0.1s;\n }\n\n @-webkit-keyframes sk-circleBounceDelay {\n 0%,\n 80%,\n 100% {\n -webkit-transform: scale(0);\n transform: scale(0);\n }\n 40% {\n -webkit-transform: scale(1);\n transform: scale(1);\n }\n }\n\n @keyframes sk-circleBounceDelay {\n 0%,\n 80%,\n 100% {\n -webkit-transform: scale(0);\n transform: scale(0);\n }\n 40% {\n -webkit-transform: scale(1);\n transform: scale(1);\n }\n }\n\n /* Chasing Dots styles */\n .spinner-chasing-dots {\n width: 40px;\n height: 40px;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n text-align: center;\n -webkit-animation: sk-rotate 2s infinite linear;\n animation: sk-rotate 2s infinite linear;\n }\n\n .dot1,\n .dot2 {\n width: 60%;\n height: 60%;\n display: inline-block;\n position: absolute;\n top: 0;\n background-color: #333;\n border-radius: 100%;\n -webkit-animation: sk-bounce 2s infinite ease-in-out;\n animation: sk-bounce 2s infinite ease-in-out;\n }\n\n .dot2 {\n top: auto;\n bottom: 0;\n -webkit-animation-delay: -1s;\n animation-delay: -1s;\n }\n\n @-webkit-keyframes sk-rotate {\n 100% {\n -webkit-transform: rotate(360deg);\n }\n }\n @keyframes sk-rotate {\n 100% {\n transform: rotate(360deg);\n -webkit-transform: rotate(360deg);\n }\n }\n\n @-webkit-keyframes sk-bounce {\n 0%,\n 100% {\n -webkit-transform: scale(0);\n }\n 50% {\n -webkit-transform: scale(1);\n }\n }\n\n @keyframes sk-bounce {\n 0%,\n 100% {\n transform: scale(0);\n -webkit-transform: scale(0);\n }\n 50% {\n transform: scale(1);\n -webkit-transform: scale(1);\n }\n }\n\n .full-screen {\n position: fixed;\n position: -ms-page;\n }\n `,\n ],\n imports: [CommonModule],\n})\nexport class NgxLoadingComponent implements OnInit {\n @Input() show = false;\n @Input() config: INgxLoadingConfig = new NgxLoadingConfig();\n @Input()\n template!: TemplateRef<Element>;\n private defaultConfig: INgxLoadingConfig = {\n animationType: ngxLoadingAnimationTypes.threeBounce,\n backdropBackgroundColour: 'rgba(0, 0, 0, 0.3)',\n backdropBorderRadius: '0px',\n fullScreenBackdrop: false,\n primaryColour: '#ffffff',\n secondaryColour: '#ffffff',\n tertiaryColour: '#ffffff',\n };\n public ngxLoadingAnimationTypes = ngxLoadingAnimationTypes;\n\n constructor(private LoadingService: NgxLoadingService) {}\n\n ngOnInit() {\n this.setupConfig();\n }\n\n private setupConfig(): void {\n for (const option in this.defaultConfig) {\n if (this.config[option] != null) {\n continue;\n }\n\n this.config[option] =\n this.LoadingService.loadingConfig[option] != null\n ? this.LoadingService.loadingConfig[option]\n : this.defaultConfig[option];\n }\n }\n}\n","import type { ModuleWithProviders } from '@angular/core';\nimport { NgModule } from '@angular/core';\nimport type { INgxLoadingConfig } from './ngx-loading-config';\nimport { NgxLoadingComponent } from './ngx-loading.component';\n@NgModule({\n imports: [NgxLoadingComponent],\n exports: [NgxLoadingComponent],\n})\nexport class NgxLoadingModule {\n static forRoot(\n loadingConfig: INgxLoadingConfig\n ): ModuleWithProviders<NgxLoadingModule> {\n return {\n ngModule: NgxLoadingModule,\n providers: [{ provide: 'loadingConfig', useValue: loadingConfig }],\n };\n }\n}\n","/*\n * Public API Surface of ngx-loading\n */\n\nexport * from './lib/ngx-loading.service';\nexport * from './lib/ngx-loading.component';\nexport * from './lib/ngx-loading.module';\nexport * from './lib/ngx-loading-config';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.NgxLoadingService"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ngx-loading-fork.mjs","sources":["../../../projects/ngx-loading/src/lib/ngx-loading-config.ts","../../../projects/ngx-loading/src/lib/ngx-loading.service.ts","../../../projects/ngx-loading/src/lib/ngx-loading.component.ts","../../../projects/ngx-loading/src/lib/ngx-loading.component.html","../../../projects/ngx-loading/src/lib/ngx-loading.module.ts","../../../projects/ngx-loading/src/public-api.ts","../../../projects/ngx-loading/src/ngx-loading-fork.ts"],"sourcesContent":["export interface INgxLoadingConfig {\n backdropBorderRadius?: string;\n backdropBackgroundColour?: string;\n fullScreenBackdrop?: boolean;\n animationType?: string;\n primaryColour?: string;\n secondaryColour?: string;\n tertiaryColour?: string;\n [key: string]: string | boolean | undefined;\n}\n\nexport class NgxLoadingConfig implements INgxLoadingConfig {\n backdropBorderRadius?: string;\n backdropBackgroundColour?: string;\n fullScreenBackdrop?: boolean;\n animationType?: string;\n primaryColour?: string;\n secondaryColour?: string;\n tertiaryColour?: string;\n [key: string]: string | boolean | undefined;\n\n constructor(config: INgxLoadingConfig = {}) {\n this.backdropBorderRadius = config.backdropBorderRadius;\n this.backdropBackgroundColour = config.backdropBackgroundColour;\n this.fullScreenBackdrop = config.fullScreenBackdrop;\n this.animationType = config.animationType;\n this.primaryColour = config.primaryColour;\n this.secondaryColour = config.secondaryColour;\n this.tertiaryColour = config.tertiaryColour;\n }\n}\n\nexport const ngxLoadingAnimationTypes = {\n chasingDots: 'chasing-dots',\n circle: 'sk-circle',\n circleSwish: 'circleSwish',\n cubeGrid: 'sk-cube-grid',\n doubleBounce: 'double-bounce',\n none: 'none',\n pulse: 'pulse',\n rectangleBounce: 'rectangle-bounce',\n rotatingPlane: 'rotating-plane',\n threeBounce: 'three-bounce',\n wanderingCubes: 'wandering-cubes',\n};\n","import { Inject, Injectable, Optional } from '@angular/core';\nimport type { INgxLoadingConfig} from './ngx-loading-config';\nimport { NgxLoadingConfig } from './ngx-loading-config';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class NgxLoadingService {\n public loadingConfig: INgxLoadingConfig;\n\n constructor(\n @Optional() @Inject('loadingConfig') private config: INgxLoadingConfig\n ) {\n this.loadingConfig = this.config || new NgxLoadingConfig();\n }\n}\n","import { OnInit, TemplateRef } from '@angular/core';\nimport { Component, Input } from '@angular/core';\nimport {\n ngxLoadingAnimationTypes,\n NgxLoadingConfig,\n} from './ngx-loading-config';\nimport { INgxLoadingConfig } from './ngx-loading-config';\nimport { NgxLoadingService } from './ngx-loading.service';\nimport { CommonModule } from '@angular/common';\n\n@Component({\n selector: 'ngx-loading',\n templateUrl: './ngx-loading.component.html',\n styles: [\n `\n .backdrop {\n z-index: 1999;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(0, 0, 0, 0.3);\n }\n\n /* Spinner Circle styles */\n .spinner-circle,\n .spinner-circle:after {\n border-radius: 50%;\n width: 10em;\n height: 10em;\n }\n\n .spinner-circle {\n font-size: 6px;\n border-top: 1.1em solid rgba(255, 255, 255, 0.2);\n border-right: 1.1em solid rgba(255, 255, 255, 0.2);\n border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);\n border-left: 1.1em solid #ffffff;\n margin: auto;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n -webkit-transform: translateZ(0);\n -ms-transform: translateZ(0);\n transform: translateZ(0);\n -webkit-animation: load8 1.1s infinite linear;\n animation: load8 1.1s infinite linear;\n }\n @-webkit-keyframes load8 {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n }\n @keyframes load8 {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n }\n\n /* Circle Swish styles */\n .spinner-circle-swish {\n font-size: 60px;\n overflow: hidden;\n width: 1em;\n height: 1em;\n z-index: 2000;\n border-radius: 50%;\n margin: auto;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n -webkit-transform: translateZ(0);\n -ms-transform: translateZ(0);\n transform: translateZ(0);\n -webkit-animation: load6 1.7s infinite ease;\n animation: load6 1.7s infinite ease;\n }\n @-webkit-keyframes load6 {\n 0% {\n box-shadow:\n 0 -0.83em 0 -0.4em,\n 0 -0.83em 0 -0.42em,\n 0 -0.83em 0 -0.44em,\n 0 -0.83em 0 -0.46em,\n 0 -0.83em 0 -0.477em;\n\n -webkit-transform: rotate(0deg);\n }\n 5%,\n 95% {\n box-shadow:\n 0 -0.83em 0 -0.4em,\n 0 -0.83em 0 -0.42em,\n 0 -0.83em 0 -0.44em,\n 0 -0.83em 0 -0.46em,\n 0 -0.83em 0 -0.477em;\n }\n 10%,\n 59% {\n box-shadow:\n 0 -0.83em 0 -0.4em,\n -0.087em -0.825em 0 -0.42em,\n -0.173em -0.812em 0 -0.44em,\n -0.256em -0.789em 0 -0.46em,\n -0.297em -0.775em 0 -0.477em;\n }\n 20% {\n box-shadow:\n 0 -0.83em 0 -0.4em,\n -0.338em -0.758em 0 -0.42em,\n -0.555em -0.617em 0 -0.44em,\n -0.671em -0.488em 0 -0.46em,\n -0.749em -0.34em 0 -0.477em;\n }\n 38% {\n box-shadow:\n 0 -0.83em 0 -0.4em,\n -0.377em -0.74em 0 -0.42em,\n -0.645em -0.522em 0 -0.44em,\n -0.775em -0.297em 0 -0.46em,\n -0.82em -0.09em 0 -0.477em;\n }\n 100% {\n box-shadow:\n 0 -0.83em 0 -0.4em,\n 0 -0.83em 0 -0.42em,\n 0 -0.83em 0 -0.44em,\n 0 -0.83em 0 -0.46em,\n 0 -0.83em 0 -0.477em;\n\n -webkit-transform: rotate(360deg);\n }\n }\n @keyframes load6 {\n 0% {\n box-shadow:\n 0 -0.83em 0 -0.4em,\n 0 -0.83em 0 -0.42em,\n 0 -0.83em 0 -0.44em,\n 0 -0.83em 0 -0.46em,\n 0 -0.83em 0 -0.477em;\n\n transform: rotate(0deg);\n }\n 5%,\n 95% {\n box-shadow:\n 0 -0.83em 0 -0.4em,\n 0 -0.83em 0 -0.42em,\n 0 -0.83em 0 -0.44em,\n 0 -0.83em 0 -0.46em,\n 0 -0.83em 0 -0.477em;\n }\n 10%,\n 59% {\n box-shadow:\n 0 -0.83em 0 -0.4em,\n -0.087em -0.825em 0 -0.42em,\n -0.173em -0.812em 0 -0.44em,\n -0.256em -0.789em 0 -0.46em,\n -0.297em -0.775em 0 -0.477em;\n }\n 20% {\n box-shadow:\n 0 -0.83em 0 -0.4em,\n -0.338em -0.758em 0 -0.42em,\n -0.555em -0.617em 0 -0.44em,\n -0.671em -0.488em 0 -0.46em,\n -0.749em -0.34em 0 -0.477em;\n }\n 38% {\n box-shadow:\n 0 -0.83em 0 -0.4em,\n -0.377em -0.74em 0 -0.42em,\n -0.645em -0.522em 0 -0.44em,\n -0.775em -0.297em 0 -0.46em,\n -0.82em -0.09em 0 -0.477em;\n }\n 100% {\n box-shadow:\n 0 -0.83em 0 -0.4em,\n 0 -0.83em 0 -0.42em,\n 0 -0.83em 0 -0.44em,\n 0 -0.83em 0 -0.46em,\n 0 -0.83em 0 -0.477em;\n\n transform: rotate(360deg);\n }\n }\n\n /* Cube Grid styles */\n .sk-cube-grid {\n width: 40px;\n height: 40px;\n\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n }\n\n .sk-cube-grid .sk-cube {\n width: 33%;\n height: 33%;\n background-color: #333;\n float: left;\n -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;\n animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;\n }\n\n .sk-cube-grid .sk-cube1 {\n -webkit-animation-delay: 0.2s;\n animation-delay: 0.2s;\n }\n\n .sk-cube-grid .sk-cube2 {\n -webkit-animation-delay: 0.3s;\n animation-delay: 0.3s;\n }\n\n .sk-cube-grid .sk-cube3 {\n -webkit-animation-delay: 0.4s;\n animation-delay: 0.4s;\n }\n\n .sk-cube-grid .sk-cube4 {\n -webkit-animation-delay: 0.1s;\n animation-delay: 0.1s;\n }\n\n .sk-cube-grid .sk-cube5 {\n -webkit-animation-delay: 0.2s;\n animation-delay: 0.2s;\n }\n\n .sk-cube-grid .sk-cube6 {\n -webkit-animation-delay: 0.3s;\n animation-delay: 0.3s;\n }\n\n .sk-cube-grid .sk-cube7 {\n -webkit-animation-delay: 0s;\n animation-delay: 0s;\n }\n\n .sk-cube-grid .sk-cube8 {\n -webkit-animation-delay: 0.1s;\n animation-delay: 0.1s;\n }\n\n .sk-cube-grid .sk-cube9 {\n -webkit-animation-delay: 0.2s;\n animation-delay: 0.2s;\n }\n\n @-webkit-keyframes sk-cubeGridScaleDelay {\n 0%,\n 70%,\n 100% {\n -webkit-transform: scale3D(1, 1, 1);\n transform: scale3D(1, 1, 1);\n }\n 35% {\n -webkit-transform: scale3D(0, 0, 1);\n transform: scale3D(0, 0, 1);\n }\n }\n\n @keyframes sk-cubeGridScaleDelay {\n 0%,\n 70%,\n 100% {\n -webkit-transform: scale3D(1, 1, 1);\n transform: scale3D(1, 1, 1);\n }\n 35% {\n -webkit-transform: scale3D(0, 0, 1);\n transform: scale3D(0, 0, 1);\n }\n }\n\n /* Double Bounce styles */\n .spinner-double-bounce {\n width: 40px;\n height: 40px;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n }\n\n .double-bounce1,\n .double-bounce2 {\n width: 100%;\n height: 100%;\n border-radius: 50%;\n background-color: #333;\n opacity: 0.6;\n position: absolute;\n top: 0;\n left: 0;\n -webkit-animation: sk-bounce 2s infinite ease-in-out;\n animation: sk-bounce 2s infinite ease-in-out;\n }\n\n .double-bounce2 {\n -webkit-animation-delay: -1s;\n animation-delay: -1s;\n }\n\n @-webkit-keyframes sk-bounce {\n 0%,\n 100% {\n -webkit-transform: scale(0);\n }\n 50% {\n -webkit-transform: scale(1);\n }\n }\n\n @keyframes sk-bounce {\n 0%,\n 100% {\n transform: scale(0);\n -webkit-transform: scale(0);\n }\n 50% {\n transform: scale(1);\n -webkit-transform: scale(1);\n }\n }\n\n /* Pulse styles */\n .spinner-pulse {\n width: 40px;\n height: 40px;\n background-color: #333;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n border-radius: 100%;\n -webkit-animation: sk-scaleout 1s infinite ease-in-out;\n animation: sk-scaleout 1s infinite ease-in-out;\n }\n\n @-webkit-keyframes sk-scaleout {\n 0% {\n -webkit-transform: scale(0);\n }\n 100% {\n -webkit-transform: scale(1);\n opacity: 0;\n }\n }\n\n @keyframes sk-scaleout {\n 0% {\n -webkit-transform: scale(0);\n transform: scale(0);\n }\n 100% {\n -webkit-transform: scale(1);\n transform: scale(1);\n opacity: 0;\n }\n }\n\n /* Three Bounce styles */\n .spinner-three-bounce {\n width: 70px;\n text-align: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n height: 20px;\n margin: auto;\n z-index: 2000;\n }\n\n .spinner-three-bounce > div {\n width: 18px;\n height: 18px;\n background-color: #ffffff;\n\n border-radius: 100%;\n display: inline-block;\n -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;\n animation: sk-bouncedelay 1.4s infinite ease-in-out both;\n }\n\n .spinner-three-bounce .bounce1 {\n -webkit-animation-delay: -0.32s;\n animation-delay: -0.32s;\n }\n\n .spinner-three-bounce .bounce2 {\n -webkit-animation-delay: -0.16s;\n animation-delay: -0.16s;\n }\n\n @-webkit-keyframes sk-bouncedelay {\n 0%,\n 80%,\n 100% {\n -webkit-transform: scale(0);\n }\n 40% {\n -webkit-transform: scale(1);\n }\n }\n\n @keyframes sk-bouncedelay {\n 0%,\n 80%,\n 100% {\n -webkit-transform: scale(0);\n transform: scale(0);\n }\n 40% {\n -webkit-transform: scale(1);\n transform: scale(1);\n }\n }\n\n /* Rotate Plane styles */\n .spinner-sk-rotateplane {\n width: 40px;\n height: 40px;\n background-color: #ffffff;\n text-align: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;\n animation: sk-rotateplane 1.2s infinite ease-in-out;\n }\n\n @-webkit-keyframes sk-rotateplane {\n 0% {\n -webkit-transform: perspective(120px);\n }\n 50% {\n -webkit-transform: perspective(120px) rotateY(180deg);\n }\n 100% {\n -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg);\n }\n }\n\n @keyframes sk-rotateplane {\n 0% {\n transform: perspective(120px) rotateX(0deg) rotateY(0deg);\n -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);\n }\n 50% {\n transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);\n -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);\n }\n 100% {\n transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);\n -webkit-transform: perspective(120px) rotateX(-180deg)\n rotateY(-179.9deg);\n }\n }\n\n /* Rectangle Bounce styles*/\n .spinner-rectangle-bounce {\n width: 50px;\n height: 40px;\n font-size: 10px;\n text-align: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n }\n\n .spinner-rectangle-bounce > div {\n background-color: #ffffff;\n height: 100%;\n width: 6px;\n display: inline-block;\n -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;\n animation: sk-stretchdelay 1.2s infinite ease-in-out;\n }\n\n .spinner-rectangle-bounce .rect2 {\n -webkit-animation-delay: -1.1s;\n animation-delay: -1.1s;\n }\n\n .spinner-rectangle-bounce .rect3 {\n -webkit-animation-delay: -1s;\n animation-delay: -1s;\n }\n\n .spinner-rectangle-bounce .rect4 {\n -webkit-animation-delay: -0.9s;\n animation-delay: -0.9s;\n }\n\n .spinner-rectangle-bounce .rect5 {\n -webkit-animation-delay: -0.8s;\n animation-delay: -0.8s;\n }\n\n @-webkit-keyframes sk-stretchdelay {\n 0%,\n 40%,\n 100% {\n -webkit-transform: scaleY(0.4);\n }\n 20% {\n -webkit-transform: scaleY(1);\n }\n }\n\n @keyframes sk-stretchdelay {\n 0%,\n 40%,\n 100% {\n transform: scaleY(0.4);\n -webkit-transform: scaleY(0.4);\n }\n 20% {\n transform: scaleY(1);\n -webkit-transform: scaleY(1);\n }\n }\n\n /* Wandering Cubes styles */\n .spinner-wandering-cubes {\n width: 60px;\n height: 58px;\n font-size: 10px;\n text-align: center;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n }\n\n .cube1,\n .cube2 {\n background-color: #ffffff;\n width: 15px;\n height: 15px;\n position: absolute;\n top: 0;\n left: 0;\n -webkit-animation: sk-cubemove 1.8s infinite ease-in-out;\n animation: sk-cubemove 1.8s infinite ease-in-out;\n }\n\n .cube2 {\n -webkit-animation-delay: -0.9s;\n animation-delay: -0.9s;\n }\n\n @-webkit-keyframes sk-cubemove {\n 25% {\n -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);\n }\n 50% {\n -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);\n }\n 75% {\n -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg)\n scale(0.5);\n }\n 100% {\n -webkit-transform: rotate(-360deg);\n }\n }\n\n @keyframes sk-cubemove {\n 25% {\n transform: translateX(42px) rotate(-90deg) scale(0.5);\n -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);\n }\n 50% {\n transform: translateX(42px) translateY(42px) rotate(-179deg);\n -webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);\n }\n 50.1% {\n transform: translateX(42px) translateY(42px) rotate(-180deg);\n -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);\n }\n 75% {\n transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);\n -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg)\n scale(0.5);\n }\n 100% {\n transform: rotate(-360deg);\n -webkit-transform: rotate(-360deg);\n }\n }\n\n /* Circle styles */\n .sk-circle {\n width: 40px;\n height: 40px;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n }\n .sk-circle .sk-child {\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0;\n top: 0;\n }\n .sk-circle .sk-child:before {\n content: '';\n display: block;\n margin: 0 auto;\n width: 15%;\n height: 15%;\n background-color: #333;\n border-radius: 100%;\n -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;\n animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;\n }\n .sk-circle .sk-circle2 {\n -webkit-transform: rotate(30deg);\n -ms-transform: rotate(30deg);\n transform: rotate(30deg);\n }\n .sk-circle .sk-circle3 {\n -webkit-transform: rotate(60deg);\n -ms-transform: rotate(60deg);\n transform: rotate(60deg);\n }\n .sk-circle .sk-circle4 {\n -webkit-transform: rotate(90deg);\n -ms-transform: rotate(90deg);\n transform: rotate(90deg);\n }\n .sk-circle .sk-circle5 {\n -webkit-transform: rotate(120deg);\n -ms-transform: rotate(120deg);\n transform: rotate(120deg);\n }\n .sk-circle .sk-circle6 {\n -webkit-transform: rotate(150deg);\n -ms-transform: rotate(150deg);\n transform: rotate(150deg);\n }\n .sk-circle .sk-circle7 {\n -webkit-transform: rotate(180deg);\n -ms-transform: rotate(180deg);\n transform: rotate(180deg);\n }\n .sk-circle .sk-circle8 {\n -webkit-transform: rotate(210deg);\n -ms-transform: rotate(210deg);\n transform: rotate(210deg);\n }\n .sk-circle .sk-circle9 {\n -webkit-transform: rotate(240deg);\n -ms-transform: rotate(240deg);\n transform: rotate(240deg);\n }\n .sk-circle .sk-circle10 {\n -webkit-transform: rotate(270deg);\n -ms-transform: rotate(270deg);\n transform: rotate(270deg);\n }\n .sk-circle .sk-circle11 {\n -webkit-transform: rotate(300deg);\n -ms-transform: rotate(300deg);\n transform: rotate(300deg);\n }\n .sk-circle .sk-circle12 {\n -webkit-transform: rotate(330deg);\n -ms-transform: rotate(330deg);\n transform: rotate(330deg);\n }\n .sk-circle .sk-circle2:before {\n -webkit-animation-delay: -1.1s;\n animation-delay: -1.1s;\n }\n .sk-circle .sk-circle3:before {\n -webkit-animation-delay: -1s;\n animation-delay: -1s;\n }\n .sk-circle .sk-circle4:before {\n -webkit-animation-delay: -0.9s;\n animation-delay: -0.9s;\n }\n .sk-circle .sk-circle5:before {\n -webkit-animation-delay: -0.8s;\n animation-delay: -0.8s;\n }\n .sk-circle .sk-circle6:before {\n -webkit-animation-delay: -0.7s;\n animation-delay: -0.7s;\n }\n .sk-circle .sk-circle7:before {\n -webkit-animation-delay: -0.6s;\n animation-delay: -0.6s;\n }\n .sk-circle .sk-circle8:before {\n -webkit-animation-delay: -0.5s;\n animation-delay: -0.5s;\n }\n .sk-circle .sk-circle9:before {\n -webkit-animation-delay: -0.4s;\n animation-delay: -0.4s;\n }\n .sk-circle .sk-circle10:before {\n -webkit-animation-delay: -0.3s;\n animation-delay: -0.3s;\n }\n .sk-circle .sk-circle11:before {\n -webkit-animation-delay: -0.2s;\n animation-delay: -0.2s;\n }\n .sk-circle .sk-circle12:before {\n -webkit-animation-delay: -0.1s;\n animation-delay: -0.1s;\n }\n\n @-webkit-keyframes sk-circleBounceDelay {\n 0%,\n 80%,\n 100% {\n -webkit-transform: scale(0);\n transform: scale(0);\n }\n 40% {\n -webkit-transform: scale(1);\n transform: scale(1);\n }\n }\n\n @keyframes sk-circleBounceDelay {\n 0%,\n 80%,\n 100% {\n -webkit-transform: scale(0);\n transform: scale(0);\n }\n 40% {\n -webkit-transform: scale(1);\n transform: scale(1);\n }\n }\n\n /* Chasing Dots styles */\n .spinner-chasing-dots {\n width: 40px;\n height: 40px;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n z-index: 2000;\n text-align: center;\n -webkit-animation: sk-rotate 2s infinite linear;\n animation: sk-rotate 2s infinite linear;\n }\n\n .dot1,\n .dot2 {\n width: 60%;\n height: 60%;\n display: inline-block;\n position: absolute;\n top: 0;\n background-color: #333;\n border-radius: 100%;\n -webkit-animation: sk-bounce 2s infinite ease-in-out;\n animation: sk-bounce 2s infinite ease-in-out;\n }\n\n .dot2 {\n top: auto;\n bottom: 0;\n -webkit-animation-delay: -1s;\n animation-delay: -1s;\n }\n\n @-webkit-keyframes sk-rotate {\n 100% {\n -webkit-transform: rotate(360deg);\n }\n }\n @keyframes sk-rotate {\n 100% {\n transform: rotate(360deg);\n -webkit-transform: rotate(360deg);\n }\n }\n\n @-webkit-keyframes sk-bounce {\n 0%,\n 100% {\n -webkit-transform: scale(0);\n }\n 50% {\n -webkit-transform: scale(1);\n }\n }\n\n @keyframes sk-bounce {\n 0%,\n 100% {\n transform: scale(0);\n -webkit-transform: scale(0);\n }\n 50% {\n transform: scale(1);\n -webkit-transform: scale(1);\n }\n }\n\n .full-screen {\n position: fixed;\n position: -ms-page;\n }\n `,\n ],\n imports: [CommonModule],\n})\nexport class NgxLoadingComponent implements OnInit {\n @Input() show = false;\n @Input() config: INgxLoadingConfig = new NgxLoadingConfig();\n @Input()\n template!: TemplateRef<Element>;\n private defaultConfig: INgxLoadingConfig = {\n animationType: ngxLoadingAnimationTypes.threeBounce,\n backdropBackgroundColour: 'rgba(0, 0, 0, 0.3)',\n backdropBorderRadius: '0px',\n fullScreenBackdrop: false,\n primaryColour: '#ffffff',\n secondaryColour: '#ffffff',\n tertiaryColour: '#ffffff',\n };\n public ngxLoadingAnimationTypes = ngxLoadingAnimationTypes;\n\n constructor(private LoadingService: NgxLoadingService) {}\n\n ngOnInit() {\n this.setupConfig();\n }\n\n private setupConfig(): void {\n for (const option in this.defaultConfig) {\n if (this.config[option] != null) {\n continue;\n }\n\n this.config[option] =\n this.LoadingService.loadingConfig[option] != null\n ? this.LoadingService.loadingConfig[option]\n : this.defaultConfig[option];\n }\n }\n}\n","@if (show) {\n<div class=\"backdrop\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\" [ngStyle]=\"{\n 'border-radius': config.backdropBorderRadius,\n 'background-color': config.backdropBackgroundColour\n }\"></div>\n\n@switch (config.animationType) {\n@case (ngxLoadingAnimationTypes.circle) {\n<div class=\"spinner-circle\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\" [ngStyle]=\"{\n 'border-top-color': config.secondaryColour,\n 'border-right-color': config.secondaryColour,\n 'border-bottom-color': config.secondaryColour,\n 'border-left-color': config.primaryColour\n }\"></div>\n}\n\n@case (ngxLoadingAnimationTypes.cubeGrid) {\n<div class=\"sk-cube-grid\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"sk-cube sk-cube1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube2\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube3\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube4\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube5\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube6\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube7\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube8\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"sk-cube sk-cube9\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.rotatingPlane) {\n<div class=\"spinner-sk-rotateplane\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"\n [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"></div>\n}\n\n@case (ngxLoadingAnimationTypes.rectangleBounce) {\n<div class=\"spinner-rectangle-bounce\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"rect1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"rect2\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"rect3\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"rect4\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"rect5\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.wanderingCubes) {\n<div class=\"spinner-wandering-cubes\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"cube1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"cube2\" [ngStyle]=\"{ 'background-color': config.secondaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.doubleBounce) {\n<div class=\"spinner-double-bounce\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"double-bounce1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"double-bounce2\" [ngStyle]=\"{ 'background-color': config.secondaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.pulse) {\n<div class=\"spinner-pulse\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n}\n\n@case (ngxLoadingAnimationTypes.chasingDots) {\n<div class=\"spinner-chasing-dots\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"dot1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"dot2\" [ngStyle]=\"{ 'background-color': config.secondaryColour }\"></div>\n</div>\n}\n\n@case (ngxLoadingAnimationTypes.circleSwish) {\n<div class=\"spinner-circle-swish\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"\n [ngStyle]=\"{ color: config.primaryColour }\"></div>\n}\n\n@case (ngxLoadingAnimationTypes.none) {\n<div [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\"></div>\n}\n\n@default {\n<div class=\"spinner-three-bounce\" [ngClass]=\"{ 'full-screen': config.fullScreenBackdrop === true }\">\n <div class=\"bounce1\" [ngStyle]=\"{ 'background-color': config.primaryColour }\"></div>\n <div class=\"bounce2\" [ngStyle]=\"{ 'background-color': config.secondaryColour }\"></div>\n <div class=\"bounce3\" [ngStyle]=\"{ 'background-color': config.tertiaryColour }\"></div>\n</div>\n}\n}\n\n@if (template) {\n<ng-container>\n <ng-container *ngTemplateOutlet=\"template\"></ng-container>\n</ng-container>\n}\n}","import type { ModuleWithProviders } from '@angular/core';\nimport { NgModule } from '@angular/core';\nimport type { INgxLoadingConfig } from './ngx-loading-config';\nimport { NgxLoadingComponent } from './ngx-loading.component';\n@NgModule({\n imports: [NgxLoadingComponent],\n exports: [NgxLoadingComponent],\n})\nexport class NgxLoadingModule {\n static forRoot(\n loadingConfig: INgxLoadingConfig\n ): ModuleWithProviders<NgxLoadingModule> {\n return {\n ngModule: NgxLoadingModule,\n providers: [{ provide: 'loadingConfig', useValue: loadingConfig }],\n };\n }\n}\n","/*\n * Public API Surface of ngx-loading\n */\n\nexport * from './lib/ngx-loading.service';\nexport * from './lib/ngx-loading.component';\nexport * from './lib/ngx-loading.module';\nexport * from './lib/ngx-loading-config';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.NgxLoadingService"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ngx-loading-fork",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "21.0.0",
|
|
4
4
|
"description": "A customisable loading spinner for Angular applications.",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -41,20 +41,20 @@
|
|
|
41
41
|
},
|
|
42
42
|
"homepage": "https://github.com/JaaNantanach/ngx-loading#readme",
|
|
43
43
|
"peerDependencies": {
|
|
44
|
-
"@angular/common": "^
|
|
45
|
-
"@angular/core": "^
|
|
44
|
+
"@angular/common": "^21.0.0",
|
|
45
|
+
"@angular/core": "^21.0.0"
|
|
46
46
|
},
|
|
47
47
|
"dependencies": {
|
|
48
48
|
"tslib": "^2.3.0"
|
|
49
49
|
},
|
|
50
50
|
"module": "fesm2022/ngx-loading-fork.mjs",
|
|
51
|
-
"typings": "
|
|
51
|
+
"typings": "types/ngx-loading-fork.d.ts",
|
|
52
52
|
"exports": {
|
|
53
53
|
"./package.json": {
|
|
54
54
|
"default": "./package.json"
|
|
55
55
|
},
|
|
56
56
|
".": {
|
|
57
|
-
"types": "./
|
|
57
|
+
"types": "./types/ngx-loading-fork.d.ts",
|
|
58
58
|
"default": "./fesm2022/ngx-loading-fork.mjs"
|
|
59
59
|
}
|
|
60
60
|
},
|
|
File without changes
|