@ethlete/core 1.1.1 → 1.3.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.
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Observable } from 'rxjs';
|
|
1
|
+
import { combineLatest, Observable, Subject } from 'rxjs';
|
|
2
2
|
export const nextFrame = (cb) => {
|
|
3
3
|
requestAnimationFrame(() => {
|
|
4
4
|
requestAnimationFrame(cb);
|
|
@@ -15,4 +15,95 @@ export const fromNextFrame = () => {
|
|
|
15
15
|
export const forceReflow = (element = document.body) => {
|
|
16
16
|
return element.offsetHeight;
|
|
17
17
|
};
|
|
18
|
-
|
|
18
|
+
export const createFlipAnimationGroup = (config) => {
|
|
19
|
+
const { elements, duration = 250, easing = 'cubic-bezier(0.4, 0, 0.2, 1)' } = config;
|
|
20
|
+
const flips = elements.map((el) => createFlipAnimation({ element: el, duration, easing }));
|
|
21
|
+
const onStart$ = combineLatest(flips.map((animation) => animation.onStart$));
|
|
22
|
+
const onFinish$ = combineLatest(flips.map((animation) => animation.onFinish$));
|
|
23
|
+
const onCancel$ = combineLatest(flips.map((animation) => animation.onCancel$));
|
|
24
|
+
const updateInit = () => {
|
|
25
|
+
flips.forEach((animation) => animation.updateInit());
|
|
26
|
+
};
|
|
27
|
+
const play = () => {
|
|
28
|
+
flips.forEach((animation) => animation.play());
|
|
29
|
+
};
|
|
30
|
+
const cancel = () => {
|
|
31
|
+
flips.forEach((animation) => animation.cancel());
|
|
32
|
+
};
|
|
33
|
+
return {
|
|
34
|
+
updateInit,
|
|
35
|
+
play,
|
|
36
|
+
cancel,
|
|
37
|
+
onStart$,
|
|
38
|
+
onFinish$,
|
|
39
|
+
onCancel$,
|
|
40
|
+
};
|
|
41
|
+
};
|
|
42
|
+
export const createFlipAnimation = (config) => {
|
|
43
|
+
const { element: el, duration = 250, easing = 'cubic-bezier(0.4, 0, 0.2, 1)' } = config;
|
|
44
|
+
let initialRect = el.getBoundingClientRect();
|
|
45
|
+
let animation = null;
|
|
46
|
+
const onStart$ = new Subject();
|
|
47
|
+
const onFinish$ = new Subject();
|
|
48
|
+
const onCancel$ = new Subject();
|
|
49
|
+
const onAnimationFinish = () => {
|
|
50
|
+
cleanup();
|
|
51
|
+
onFinish$.next();
|
|
52
|
+
};
|
|
53
|
+
const onAnimationCancel = () => {
|
|
54
|
+
cleanup();
|
|
55
|
+
onCancel$.next();
|
|
56
|
+
};
|
|
57
|
+
const cleanup = () => {
|
|
58
|
+
if (!animation) {
|
|
59
|
+
return;
|
|
60
|
+
}
|
|
61
|
+
animation.removeEventListener('finish', onAnimationFinish);
|
|
62
|
+
animation.removeEventListener('cancel', onAnimationCancel);
|
|
63
|
+
};
|
|
64
|
+
const updateInit = () => {
|
|
65
|
+
initialRect = el.getBoundingClientRect();
|
|
66
|
+
};
|
|
67
|
+
const play = () => {
|
|
68
|
+
const lastRect = el.getBoundingClientRect();
|
|
69
|
+
const delta = {
|
|
70
|
+
x: initialRect.left - lastRect.left,
|
|
71
|
+
y: initialRect.top - lastRect.top,
|
|
72
|
+
scaleX: initialRect.width / lastRect.width,
|
|
73
|
+
scaleY: initialRect.height / lastRect.height,
|
|
74
|
+
};
|
|
75
|
+
animation = el.animate([
|
|
76
|
+
{
|
|
77
|
+
transformOrigin: 'top left',
|
|
78
|
+
transform: `
|
|
79
|
+
translate(${delta.x}px, ${delta.y}px)
|
|
80
|
+
scale(${delta.scaleX}, ${delta.scaleY})
|
|
81
|
+
`,
|
|
82
|
+
},
|
|
83
|
+
{
|
|
84
|
+
transformOrigin: 'top left',
|
|
85
|
+
transform: 'none',
|
|
86
|
+
},
|
|
87
|
+
], {
|
|
88
|
+
duration,
|
|
89
|
+
easing,
|
|
90
|
+
fill: 'both',
|
|
91
|
+
});
|
|
92
|
+
animation.addEventListener('finish', onAnimationFinish);
|
|
93
|
+
animation.addEventListener('cancel', onAnimationCancel);
|
|
94
|
+
onStart$.next();
|
|
95
|
+
};
|
|
96
|
+
const cancel = () => {
|
|
97
|
+
animation?.cancel();
|
|
98
|
+
cleanup();
|
|
99
|
+
};
|
|
100
|
+
return {
|
|
101
|
+
updateInit,
|
|
102
|
+
play,
|
|
103
|
+
cancel,
|
|
104
|
+
onStart$: onStart$.asObservable(),
|
|
105
|
+
onFinish$: onFinish$.asObservable(),
|
|
106
|
+
onCancel$: onCancel$.asObservable(),
|
|
107
|
+
};
|
|
108
|
+
};
|
|
109
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYW5pbWF0aW9uLnV0aWxzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb3JlL3NyYy9saWIvdXRpbHMvYW5pbWF0aW9uLnV0aWxzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxhQUFhLEVBQUUsVUFBVSxFQUFFLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUUxRCxNQUFNLENBQUMsTUFBTSxTQUFTLEdBQUcsQ0FBQyxFQUFjLEVBQUUsRUFBRTtJQUMxQyxxQkFBcUIsQ0FBQyxHQUFHLEVBQUU7UUFDekIscUJBQXFCLENBQUMsRUFBRSxDQUFDLENBQUM7SUFDNUIsQ0FBQyxDQUFDLENBQUM7QUFDTCxDQUFDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxhQUFhLEdBQUcsR0FBRyxFQUFFO0lBQ2hDLE9BQU8sSUFBSSxVQUFVLENBQU8sQ0FBQyxRQUFRLEVBQUUsRUFBRTtRQUN2QyxTQUFTLENBQUMsR0FBRyxFQUFFO1lBQ2IsUUFBUSxDQUFDLElBQUksRUFBRSxDQUFDO1lBQ2hCLFFBQVEsQ0FBQyxRQUFRLEVBQUUsQ0FBQztRQUN0QixDQUFDLENBQUMsQ0FBQztJQUNMLENBQUMsQ0FBQyxDQUFDO0FBQ0wsQ0FBQyxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sV0FBVyxHQUFHLENBQUMsVUFBdUIsUUFBUSxDQUFDLElBQUksRUFBRSxFQUFFO0lBQ2xFLE9BQU8sT0FBTyxDQUFDLFlBQVksQ0FBQztBQUM5QixDQUFDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSx3QkFBd0IsR0FBRyxDQUFDLE1BQXVFLEVBQUUsRUFBRTtJQUNsSCxNQUFNLEVBQUUsUUFBUSxFQUFFLFFBQVEsR0FBRyxHQUFHLEVBQUUsTUFBTSxHQUFHLDhCQUE4QixFQUFFLEdBQUcsTUFBTSxDQUFDO0lBRXJGLE1BQU0sS0FBSyxHQUFHLFFBQVEsQ0FBQyxHQUFHLENBQUMsQ0FBQyxFQUFFLEVBQUUsRUFB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QyxZQUFZLEVBQUU7S0FDcEMsQ0FBQztBQUNKLENBQUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNvbWJpbmVMYXRlc3QsIE9ic2VydmFibGUsIFN1YmplY3QgfSBmcm9tICdyeGpzJztcblxuZXhwb3J0IGNvbnN0IG5leHRGcmFtZSA9IChjYjogKCkgPT4gdm9pZCkgPT4ge1xuICByZXF1ZXN0QW5pbWF0aW9uRnJhbWUoKCkgPT4ge1xuICAgIHJlcXVlc3RBbmltYXRpb25GcmFtZShjYik7XG4gIH0pO1xufTtcblxuZXhwb3J0IGNvbnN0IGZyb21OZXh0RnJhbWUgPSAoKSA9PiB7XG4gIHJldHVybiBuZXcgT2JzZXJ2YWJsZTx2b2lkPigob2JzZXJ2ZXIpID0+IHtcbiAgICBuZXh0RnJhbWUoKCkgPT4ge1xuICAgICAgb2JzZXJ2ZXIubmV4dCgpO1xuICAgICAgb2JzZXJ2ZXIuY29tcGxldGUoKTtcbiAgICB9KTtcbiAgfSk7XG59O1xuXG5leHBvcnQgY29uc3QgZm9yY2VSZWZsb3cgPSAoZWxlbWVudDogSFRNTEVsZW1lbnQgPSBkb2N1bWVudC5ib2R5KSA9PiB7XG4gIHJldHVybiBlbGVtZW50Lm9mZnNldEhlaWdodDtcbn07XG5cbmV4cG9ydCBjb25zdCBjcmVhdGVGbGlwQW5pbWF0aW9uR3JvdXAgPSAoY29uZmlnOiB7IGVsZW1lbnRzOiBIVE1MRWxlbWVudFtdOyBkdXJhdGlvbj86IG51bWJlcjsgZWFzaW5nPzogc3RyaW5nIH0pID0+IHtcbiAgY29uc3QgeyBlbGVtZW50cywgZHVyYXRpb24gPSAyNTAsIGVhc2luZyA9ICdjdWJpYy1iZXppZXIoMC40LCAwLCAwLjIsIDEpJyB9ID0gY29uZmlnO1xuXG4gIGNvbnN0IGZsaXBzID0gZWxlbWVudHMubWFwKChlbCkgPT4gY3JlYXRlRmxpcEFuaW1hdGlvbih7IGVsZW1lbnQ6IGVsLCBkdXJhdGlvbiwgZWFzaW5nIH0pKTtcblxuICBjb25zdCBvblN0YXJ0JCA9IGNvbWJpbmVMYXRlc3QoZmxpcHMubWFwKChhbmltYXRpb24pID0+IGFuaW1hdGlvbi5vblN0YXJ0JCkpO1xuICBjb25zdCBvbkZpbmlzaCQgPSBjb21iaW5lTGF0ZXN0KGZsaXBzLm1hcCgoYW5pbWF0aW9uKSA9PiBhbmltYXRpb24ub25GaW5pc2gkKSk7XG4gIGNvbnN0IG9uQ2FuY2VsJCA9IGNvbWJpbmVMYXRlc3QoZmxpcHMubWFwKChhbmltYXRpb24pID0+IGFuaW1hdGlvbi5vbkNhbmNlbCQpKTtcblxuICBjb25zdCB1cGRhdGVJbml0ID0gKCkgPT4ge1xuICAgIGZsaXBzLmZvckVhY2goKGFuaW1hdGlvbikgPT4gYW5pbWF0aW9uLnVwZGF0ZUluaXQoKSk7XG4gIH07XG5cbiAgY29uc3QgcGxheSA9ICgpID0+IHtcbiAgICBmbGlwcy5mb3JFYWNoKChhbmltYXRpb24pID0+IGFuaW1hdGlvbi5wbGF5KCkpO1xuICB9O1xuXG4gIGNvbnN0IGNhbmNlbCA9ICgpID0+IHtcbiAgICBmbGlwcy5mb3JFYWNoKChhbmltYXRpb24pID0+IGFuaW1hdGlvbi5jYW5jZWwoKSk7XG4gIH07XG5cbiAgcmV0dXJuIHtcbiAgICB1cGRhdGVJbml0LFxuICAgIHBsYXksXG4gICAgY2FuY2VsLFxuICAgIG9uU3RhcnQkLFxuICAgIG9uRmluaXNoJCxcbiAgICBvbkNhbmNlbCQsXG4gIH07XG59O1xuXG5leHBvcnQgY29uc3QgY3JlYXRlRmxpcEFuaW1hdGlvbiA9IChjb25maWc6IHsgZWxlbWVudDogSFRNTEVsZW1lbnQ7IGR1cmF0aW9uPzogbnVtYmVyOyBlYXNpbmc/OiBzdHJpbmcgfSkgPT4ge1xuICBjb25zdCB7IGVsZW1lbnQ6IGVsLCBkdXJhdGlvbiA9IDI1MCwgZWFzaW5nID0gJ2N1YmljLWJlemllcigwLjQsIDAsIDAuMiwgMSknIH0gPSBjb25maWc7XG5cbiAgbGV0IGluaXRpYWxSZWN0ID0gZWwuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCk7XG4gIGxldCBhbmltYXRpb246IEFuaW1hdGlvbiB8IG51bGwgPSBudWxsO1xuXG4gIGNvbnN0IG9uU3RhcnQkID0gbmV3IFN1YmplY3Q8dm9pZD4oKTtcbiAgY29uc3Qgb25GaW5pc2gkID0gbmV3IFN1YmplY3Q8dm9pZD4oKTtcbiAgY29uc3Qgb25DYW5jZWwkID0gbmV3IFN1YmplY3Q8dm9pZD4oKTtcblxuICBjb25zdCBvbkFuaW1hdGlvbkZpbmlzaCA9ICgpID0+IHtcbiAgICBjbGVhbnVwKCk7XG4gICAgb25GaW5pc2gkLm5leHQoKTtcbiAgfTtcblxuICBjb25zdCBvbkFuaW1hdGlvbkNhbmNlbCA9ICgpID0+IHtcbiAgICBjbGVhbnVwKCk7XG4gICAgb25DYW5jZWwkLm5leHQoKTtcbiAgfTtcblxuICBjb25zdCBjbGVhbnVwID0gKCkgPT4ge1xuICAgIGlmICghYW5pbWF0aW9uKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgYW5pbWF0aW9uLnJlbW92ZUV2ZW50TGlzdGVuZXIoJ2ZpbmlzaCcsIG9uQW5pbWF0aW9uRmluaXNoKTtcbiAgICBhbmltYXRpb24ucmVtb3ZlRXZlbnRMaXN0ZW5lcignY2FuY2VsJywgb25BbmltYXRpb25DYW5jZWwpO1xuICB9O1xuXG4gIGNvbnN0IHVwZGF0ZUluaXQgPSAoKSA9PiB7XG4gICAgaW5pdGlhbFJlY3QgPSBlbC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcbiAgfTtcblxuICBjb25zdCBwbGF5ID0gKCkgPT4ge1xuICAgIGNvbnN0IGxhc3RSZWN0ID0gZWwuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCk7XG5cbiAgICBjb25zdCBkZWx0YSA9IHtcbiAgICAgIHg6IGluaXRpYWxSZWN0LmxlZnQgLSBsYXN0UmVjdC5sZWZ0LFxuICAgICAgeTogaW5pdGlhbFJlY3QudG9wIC0gbGFzdFJlY3QudG9wLFxuICAgICAgc2NhbGVYOiBpbml0aWFsUmVjdC53aWR0aCAvIGxhc3RSZWN0LndpZHRoLFxuICAgICAgc2NhbGVZOiBpbml0aWFsUmVjdC5oZWlnaHQgLyBsYXN0UmVjdC5oZWlnaHQsXG4gICAgfTtcblxuICAgIGFuaW1hdGlvbiA9IGVsLmFuaW1hdGUoXG4gICAgICBbXG4gICAgICAgIHtcbiAgICAgICAgICB0cmFuc2Zvcm1PcmlnaW46ICd0b3AgbGVmdCcsXG4gICAgICAgICAgdHJhbnNmb3JtOiBgXG4gICAgICAgICAgdHJhbnNsYXRlKCR7ZGVsdGEueH1weCwgJHtkZWx0YS55fXB4KVxuICAgICAgICAgIHNjYWxlKCR7ZGVsdGEuc2NhbGVYfSwgJHtkZWx0YS5zY2FsZVl9KVxuICAgICAgICBgLFxuICAgICAgICB9LFxuICAgICAgICB7XG4gICAgICAgICAgdHJhbnNmb3JtT3JpZ2luOiAndG9wIGxlZnQnLFxuICAgICAgICAgIHRyYW5zZm9ybTogJ25vbmUnLFxuICAgICAgICB9LFxuICAgICAgXSxcbiAgICAgIHtcbiAgICAgICAgZHVyYXRpb24sXG4gICAgICAgIGVhc2luZyxcbiAgICAgICAgZmlsbDogJ2JvdGgnLFxuICAgICAgfSxcbiAgICApO1xuXG4gICAgYW5pbWF0aW9uLmFkZEV2ZW50TGlzdGVuZXIoJ2ZpbmlzaCcsIG9uQW5pbWF0aW9uRmluaXNoKTtcbiAgICBhbmltYXRpb24uYWRkRXZlbnRMaXN0ZW5lcignY2FuY2VsJywgb25BbmltYXRpb25DYW5jZWwpO1xuXG4gICAgb25TdGFydCQubmV4dCgpO1xuICB9O1xuXG4gIGNvbnN0IGNhbmNlbCA9ICgpID0+IHtcbiAgICBhbmltYXRpb24/LmNhbmNlbCgpO1xuXG4gICAgY2xlYW51cCgpO1xuICB9O1xuXG4gIHJldHVybiB7XG4gICAgdXBkYXRlSW5pdCxcbiAgICBwbGF5LFxuICAgIGNhbmNlbCxcbiAgICBvblN0YXJ0JDogb25TdGFydCQuYXNPYnNlcnZhYmxlKCksXG4gICAgb25GaW5pc2gkOiBvbkZpbmlzaCQuYXNPYnNlcnZhYmxlKCksXG4gICAgb25DYW5jZWwkOiBvbkNhbmNlbCQuYXNPYnNlcnZhYmxlKCksXG4gIH07XG59O1xuIl19
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { inject, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, HostBinding, InjectionToken, Injectable, ElementRef, Inject, Optional, isDevMode, Directive, EventEmitter, Output, NgZone, Pipe, QueryList } from '@angular/core';
|
|
3
3
|
import { DomSanitizer, Meta, Title } from '@angular/platform-browser';
|
|
4
|
-
import { fromEvent, Observable, Subject, startWith, map, takeUntil, distinctUntilChanged, BehaviorSubject, filter,
|
|
4
|
+
import { fromEvent, Observable, Subject, combineLatest, startWith, map, takeUntil, distinctUntilChanged, BehaviorSubject, filter, pairwise, debounceTime, shareReplay, tap, merge, skip, switchMap, take } from 'rxjs';
|
|
5
5
|
import { coerceElement, coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
|
|
6
6
|
import { DOCUMENT } from '@angular/common';
|
|
7
7
|
import { Router, NavigationEnd } from '@angular/router';
|
|
@@ -364,6 +364,97 @@ const fromNextFrame = () => {
|
|
|
364
364
|
const forceReflow = (element = document.body) => {
|
|
365
365
|
return element.offsetHeight;
|
|
366
366
|
};
|
|
367
|
+
const createFlipAnimationGroup = (config) => {
|
|
368
|
+
const { elements, duration = 250, easing = 'cubic-bezier(0.4, 0, 0.2, 1)' } = config;
|
|
369
|
+
const flips = elements.map((el) => createFlipAnimation({ element: el, duration, easing }));
|
|
370
|
+
const onStart$ = combineLatest(flips.map((animation) => animation.onStart$));
|
|
371
|
+
const onFinish$ = combineLatest(flips.map((animation) => animation.onFinish$));
|
|
372
|
+
const onCancel$ = combineLatest(flips.map((animation) => animation.onCancel$));
|
|
373
|
+
const updateInit = () => {
|
|
374
|
+
flips.forEach((animation) => animation.updateInit());
|
|
375
|
+
};
|
|
376
|
+
const play = () => {
|
|
377
|
+
flips.forEach((animation) => animation.play());
|
|
378
|
+
};
|
|
379
|
+
const cancel = () => {
|
|
380
|
+
flips.forEach((animation) => animation.cancel());
|
|
381
|
+
};
|
|
382
|
+
return {
|
|
383
|
+
updateInit,
|
|
384
|
+
play,
|
|
385
|
+
cancel,
|
|
386
|
+
onStart$,
|
|
387
|
+
onFinish$,
|
|
388
|
+
onCancel$,
|
|
389
|
+
};
|
|
390
|
+
};
|
|
391
|
+
const createFlipAnimation = (config) => {
|
|
392
|
+
const { element: el, duration = 250, easing = 'cubic-bezier(0.4, 0, 0.2, 1)' } = config;
|
|
393
|
+
let initialRect = el.getBoundingClientRect();
|
|
394
|
+
let animation = null;
|
|
395
|
+
const onStart$ = new Subject();
|
|
396
|
+
const onFinish$ = new Subject();
|
|
397
|
+
const onCancel$ = new Subject();
|
|
398
|
+
const onAnimationFinish = () => {
|
|
399
|
+
cleanup();
|
|
400
|
+
onFinish$.next();
|
|
401
|
+
};
|
|
402
|
+
const onAnimationCancel = () => {
|
|
403
|
+
cleanup();
|
|
404
|
+
onCancel$.next();
|
|
405
|
+
};
|
|
406
|
+
const cleanup = () => {
|
|
407
|
+
if (!animation) {
|
|
408
|
+
return;
|
|
409
|
+
}
|
|
410
|
+
animation.removeEventListener('finish', onAnimationFinish);
|
|
411
|
+
animation.removeEventListener('cancel', onAnimationCancel);
|
|
412
|
+
};
|
|
413
|
+
const updateInit = () => {
|
|
414
|
+
initialRect = el.getBoundingClientRect();
|
|
415
|
+
};
|
|
416
|
+
const play = () => {
|
|
417
|
+
const lastRect = el.getBoundingClientRect();
|
|
418
|
+
const delta = {
|
|
419
|
+
x: initialRect.left - lastRect.left,
|
|
420
|
+
y: initialRect.top - lastRect.top,
|
|
421
|
+
scaleX: initialRect.width / lastRect.width,
|
|
422
|
+
scaleY: initialRect.height / lastRect.height,
|
|
423
|
+
};
|
|
424
|
+
animation = el.animate([
|
|
425
|
+
{
|
|
426
|
+
transformOrigin: 'top left',
|
|
427
|
+
transform: `
|
|
428
|
+
translate(${delta.x}px, ${delta.y}px)
|
|
429
|
+
scale(${delta.scaleX}, ${delta.scaleY})
|
|
430
|
+
`,
|
|
431
|
+
},
|
|
432
|
+
{
|
|
433
|
+
transformOrigin: 'top left',
|
|
434
|
+
transform: 'none',
|
|
435
|
+
},
|
|
436
|
+
], {
|
|
437
|
+
duration,
|
|
438
|
+
easing,
|
|
439
|
+
fill: 'both',
|
|
440
|
+
});
|
|
441
|
+
animation.addEventListener('finish', onAnimationFinish);
|
|
442
|
+
animation.addEventListener('cancel', onAnimationCancel);
|
|
443
|
+
onStart$.next();
|
|
444
|
+
};
|
|
445
|
+
const cancel = () => {
|
|
446
|
+
animation === null || animation === void 0 ? void 0 : animation.cancel();
|
|
447
|
+
cleanup();
|
|
448
|
+
};
|
|
449
|
+
return {
|
|
450
|
+
updateInit,
|
|
451
|
+
play,
|
|
452
|
+
cancel,
|
|
453
|
+
onStart$: onStart$.asObservable(),
|
|
454
|
+
onFinish$: onFinish$.asObservable(),
|
|
455
|
+
onCancel$: onCancel$.asObservable(),
|
|
456
|
+
};
|
|
457
|
+
};
|
|
367
458
|
|
|
368
459
|
const clamp = (value, min = 0, max = 100) => {
|
|
369
460
|
return Math.max(min, Math.min(max, value));
|
|
@@ -2456,5 +2547,5 @@ const Validators = {
|
|
|
2456
2547
|
* Generated bundle index. Do not edit.
|
|
2457
2548
|
*/
|
|
2458
2549
|
|
|
2459
|
-
export { ANIMATABLE_TOKEN, ANIMATED_LIFECYCLE_TOKEN, AnimatableDirective, AnimatedLifecycleDirective, ClickObserverFactory, ClickObserverService, ClickOutsideDirective, ContentObserverService, CursorDragScrollDirective, DEFAULT_VIEWPORT_CONFIG, DestroyService, FocusVisibleService, IS_ARRAY_NOT_EMPTY, IS_EMAIL, IsArrayNotEmpty, IsEmail, LetContext, LetDirective, MUST_MATCH, Memo, MustMatch, MutationObserverFactory, NormalizeGameResultTypePipe, NormalizeMatchParticipantsPipe, NormalizeMatchScorePipe, NormalizeMatchStatePipe, NormalizeMatchTypePipe, OBSERVE_SCROLL_STATE, ObserveContentDirective, ObserveResizeDirective, ObserveScrollStateDirective, RepeatDirective, ResizeObserverFactory, ResizeObserverService, RouterStateService, SCROLL_OBSERVER_FIRST_ELEMENT_CLASS, SCROLL_OBSERVER_IGNORE_TARGET_CLASS, SCROLL_OBSERVER_LAST_ELEMENT_CLASS, SEO_DIRECTIVE_TOKEN, ScrollObserverFirstElementDirective, ScrollObserverIgnoreTargetDirective, ScrollObserverLastElementDirective, SeoDirective, StructuredDataComponent, ToArrayPipe, TypedQueryList, VIEWPORT_CONFIG, Validators, ViewportService, clamp, clone, createMediaQueryObservable, createReactiveBindings, deleteCookie, elementCanScroll, equal, forceReflow, fromNextFrame, getCookie, getDomain, getGroupMatchPoints, getGroupMatchScore, getKnockoutMatchScore, getMatchScoreSubLine, hasCookie, isGroupMatch, isKnockoutMatch, mergeSeoConfig, nextFrame, normalizeGameResultType, normalizeMatchParticipant, normalizeMatchParticipants, normalizeMatchScore, normalizeMatchState, normalizeMatchType, provideViewportConfig, routerDisableScrollTop, setCookie, toArray, toArrayTrackByFn };
|
|
2550
|
+
export { ANIMATABLE_TOKEN, ANIMATED_LIFECYCLE_TOKEN, AnimatableDirective, AnimatedLifecycleDirective, ClickObserverFactory, ClickObserverService, ClickOutsideDirective, ContentObserverService, CursorDragScrollDirective, DEFAULT_VIEWPORT_CONFIG, DestroyService, FocusVisibleService, IS_ARRAY_NOT_EMPTY, IS_EMAIL, IsArrayNotEmpty, IsEmail, LetContext, LetDirective, MUST_MATCH, Memo, MustMatch, MutationObserverFactory, NormalizeGameResultTypePipe, NormalizeMatchParticipantsPipe, NormalizeMatchScorePipe, NormalizeMatchStatePipe, NormalizeMatchTypePipe, OBSERVE_SCROLL_STATE, ObserveContentDirective, ObserveResizeDirective, ObserveScrollStateDirective, RepeatDirective, ResizeObserverFactory, ResizeObserverService, RouterStateService, SCROLL_OBSERVER_FIRST_ELEMENT_CLASS, SCROLL_OBSERVER_IGNORE_TARGET_CLASS, SCROLL_OBSERVER_LAST_ELEMENT_CLASS, SEO_DIRECTIVE_TOKEN, ScrollObserverFirstElementDirective, ScrollObserverIgnoreTargetDirective, ScrollObserverLastElementDirective, SeoDirective, StructuredDataComponent, ToArrayPipe, TypedQueryList, VIEWPORT_CONFIG, Validators, ViewportService, clamp, clone, createFlipAnimation, createFlipAnimationGroup, createMediaQueryObservable, createReactiveBindings, deleteCookie, elementCanScroll, equal, forceReflow, fromNextFrame, getCookie, getDomain, getGroupMatchPoints, getGroupMatchScore, getKnockoutMatchScore, getMatchScoreSubLine, hasCookie, isGroupMatch, isKnockoutMatch, mergeSeoConfig, nextFrame, normalizeGameResultType, normalizeMatchParticipant, normalizeMatchParticipants, normalizeMatchScore, normalizeMatchState, normalizeMatchType, provideViewportConfig, routerDisableScrollTop, setCookie, toArray, toArrayTrackByFn };
|
|
2460
2551
|
//# sourceMappingURL=ethlete-core.mjs.map
|