@ethlete/core 3.7.0 → 3.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/directives/observe-visibility/observe-visibility.directive.mjs +18 -8
- package/esm2022/lib/services/router-state.service.mjs +3 -3
- package/esm2022/lib/services/viewport.service.mjs +10 -4
- package/esm2022/lib/utils/clone.util.mjs +1 -1
- package/esm2022/lib/utils/form.utils.mjs +1 -1
- package/esm2022/lib/utils/mutation-observable.util.mjs +7 -2
- package/esm2022/lib/utils/public-api.mjs +2 -1
- package/esm2022/lib/utils/signal.utils.mjs +72 -0
- package/fesm2022/ethlete-core.mjs +105 -13
- package/fesm2022/ethlete-core.mjs.map +1 -1
- package/lib/directives/observe-visibility/observe-visibility.directive.d.ts +9 -2
- package/lib/utils/public-api.d.ts +1 -0
- package/lib/utils/signal.utils.d.ts +7 -0
- package/package.json +2 -2
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, HostBinding, InjectionToken, assertInInjectionContext, DestroyRef, ElementRef, isDevMode, Directive, Injectable, NgZone, EventEmitter, booleanAttribute, numberAttribute, Output, Injector, ViewContainerRef, TemplateRef, signal, Pipe, QueryList } from '@angular/core';
|
|
2
|
+
import { inject, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, HostBinding, InjectionToken, assertInInjectionContext, DestroyRef, ElementRef, effect, isDevMode, Directive, Injectable, NgZone, EventEmitter, booleanAttribute, numberAttribute, Output, Injector, ViewContainerRef, TemplateRef, computed, signal, Pipe, QueryList } from '@angular/core';
|
|
3
3
|
import { DomSanitizer, Meta, Title } from '@angular/platform-browser';
|
|
4
4
|
import { Subject, BehaviorSubject, takeUntil, switchMap, of, tap, Observable, combineLatest, timer, startWith, map, distinctUntilChanged, shareReplay, skip, take, debounceTime, merge, fromEvent, filter, takeWhile, pairwise, finalize } from 'rxjs';
|
|
5
5
|
import { END, HOME, PAGE_DOWN, PAGE_UP, UP_ARROW, DOWN_ARROW } from '@angular/cdk/keycodes';
|
|
@@ -648,7 +648,12 @@ const createMutationObservable = (config) => {
|
|
|
648
648
|
const oldValueStyles = oldValue?.split(';').map((s) => s.trim()) ?? [];
|
|
649
649
|
const newValueStyles = newValue?.split(';').map((s) => s.trim()) ?? [];
|
|
650
650
|
const changedStyles = newValueStyles.filter((s) => !oldValueStyles.includes(s));
|
|
651
|
-
if (changedStyles.some((s) =>
|
|
651
|
+
if (changedStyles.some((s) => {
|
|
652
|
+
const [key] = s.split(':');
|
|
653
|
+
if (!key)
|
|
654
|
+
return false;
|
|
655
|
+
return config.options?.styleIgnoreList?.includes(key);
|
|
656
|
+
}))
|
|
652
657
|
continue;
|
|
653
658
|
allowedMutations.push(mutation);
|
|
654
659
|
}
|
|
@@ -1237,6 +1242,77 @@ class SelectionModel {
|
|
|
1237
1242
|
}
|
|
1238
1243
|
}
|
|
1239
1244
|
|
|
1245
|
+
const signalClasses = (el, classMap) => {
|
|
1246
|
+
for (const [classString, signal] of Object.entries(classMap)) {
|
|
1247
|
+
const classArray = classString.split(' ');
|
|
1248
|
+
if (!classArray.length) {
|
|
1249
|
+
continue;
|
|
1250
|
+
}
|
|
1251
|
+
effect(() => {
|
|
1252
|
+
const value = signal();
|
|
1253
|
+
if (value) {
|
|
1254
|
+
el.classList.add(...classArray);
|
|
1255
|
+
}
|
|
1256
|
+
else {
|
|
1257
|
+
el.classList.remove(...classArray);
|
|
1258
|
+
}
|
|
1259
|
+
});
|
|
1260
|
+
}
|
|
1261
|
+
};
|
|
1262
|
+
const signalHostClasses = (classMap) => {
|
|
1263
|
+
const el = inject(ElementRef).nativeElement;
|
|
1264
|
+
signalClasses(el, classMap);
|
|
1265
|
+
};
|
|
1266
|
+
const ALWAYS_TRUE_ATTRIBUTE_KEYS = ['disabled', 'readonly', 'required', 'checked', 'selected'];
|
|
1267
|
+
const signalAttributes = (el, attributeMap) => {
|
|
1268
|
+
for (const [attributeString, signal] of Object.entries(attributeMap)) {
|
|
1269
|
+
effect(() => {
|
|
1270
|
+
const attributeArray = attributeString.split(' ');
|
|
1271
|
+
if (!attributeArray.length) {
|
|
1272
|
+
return;
|
|
1273
|
+
}
|
|
1274
|
+
const value = signal();
|
|
1275
|
+
const valueString = `${value}`;
|
|
1276
|
+
for (const attr of attributeArray) {
|
|
1277
|
+
if (ALWAYS_TRUE_ATTRIBUTE_KEYS.includes(attr)) {
|
|
1278
|
+
if (value) {
|
|
1279
|
+
el.setAttribute(attr, '');
|
|
1280
|
+
}
|
|
1281
|
+
else {
|
|
1282
|
+
el.removeAttribute(attr);
|
|
1283
|
+
}
|
|
1284
|
+
}
|
|
1285
|
+
else {
|
|
1286
|
+
el.setAttribute(attr, valueString);
|
|
1287
|
+
}
|
|
1288
|
+
}
|
|
1289
|
+
});
|
|
1290
|
+
}
|
|
1291
|
+
};
|
|
1292
|
+
const signalHostAttributes = (attributeMap) => {
|
|
1293
|
+
const el = inject(ElementRef).nativeElement;
|
|
1294
|
+
signalAttributes(el, attributeMap);
|
|
1295
|
+
};
|
|
1296
|
+
const signalStyle = (el, styleMap) => {
|
|
1297
|
+
for (const [styleString, signal] of Object.entries(styleMap)) {
|
|
1298
|
+
effect(() => {
|
|
1299
|
+
const styleArray = styleString.split(' ');
|
|
1300
|
+
if (!styleArray.length) {
|
|
1301
|
+
return;
|
|
1302
|
+
}
|
|
1303
|
+
const value = signal();
|
|
1304
|
+
const valueString = `${value}`;
|
|
1305
|
+
for (const style of styleArray) {
|
|
1306
|
+
el.style.setProperty(style, valueString);
|
|
1307
|
+
}
|
|
1308
|
+
});
|
|
1309
|
+
}
|
|
1310
|
+
};
|
|
1311
|
+
const signalHostStyle = (styleMap) => {
|
|
1312
|
+
const el = inject(ElementRef).nativeElement;
|
|
1313
|
+
signalStyle(el, styleMap);
|
|
1314
|
+
};
|
|
1315
|
+
|
|
1240
1316
|
const scrollBehaviorSupported = supportsScrollBehavior();
|
|
1241
1317
|
let _uniqueIdCounter = 0;
|
|
1242
1318
|
const BLOCK_CLASS = 'cdk-global-scrollblock';
|
|
@@ -2018,8 +2094,8 @@ class RouterStateService {
|
|
|
2018
2094
|
this._router.events
|
|
2019
2095
|
.pipe(filter((event) => event instanceof NavigationEnd), distinctUntilChanged((a, b) => a.url === b.url), map((event) => {
|
|
2020
2096
|
const { url } = event;
|
|
2021
|
-
const urlWithoutQueryParams = url.split('?')[0];
|
|
2022
|
-
const withoutFragment = urlWithoutQueryParams.split('#')[0];
|
|
2097
|
+
const urlWithoutQueryParams = url.split('?')[0] ?? '';
|
|
2098
|
+
const withoutFragment = urlWithoutQueryParams.split('#')[0] ?? '';
|
|
2023
2099
|
return withoutFragment;
|
|
2024
2100
|
}))
|
|
2025
2101
|
.subscribe(this._route$);
|
|
@@ -2206,8 +2282,11 @@ class ViewportService {
|
|
|
2206
2282
|
this._resizeObserverService
|
|
2207
2283
|
.observe(document.documentElement)
|
|
2208
2284
|
.pipe(tap((e) => {
|
|
2209
|
-
const
|
|
2210
|
-
|
|
2285
|
+
const entry = e[0];
|
|
2286
|
+
if (!entry)
|
|
2287
|
+
return;
|
|
2288
|
+
const width = entry.contentRect.width;
|
|
2289
|
+
const height = entry.contentRect.height;
|
|
2211
2290
|
const obj = { width, height };
|
|
2212
2291
|
if (equal(obj, this._viewportSize$.value))
|
|
2213
2292
|
return;
|
|
@@ -2230,7 +2309,10 @@ class ViewportService {
|
|
|
2230
2309
|
this._resizeObserverService
|
|
2231
2310
|
.observe(scrollbarRuler)
|
|
2232
2311
|
.pipe(tap((e) => {
|
|
2233
|
-
const
|
|
2312
|
+
const entry = e[0];
|
|
2313
|
+
if (!entry)
|
|
2314
|
+
return;
|
|
2315
|
+
const size = entry.contentRect.width;
|
|
2234
2316
|
const obj = { width: 100 - size, height: 100 - size };
|
|
2235
2317
|
if (equal(obj, this._scrollbarSize$.value))
|
|
2236
2318
|
return;
|
|
@@ -3331,13 +3413,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.5", ngImpor
|
|
|
3331
3413
|
}] } });
|
|
3332
3414
|
|
|
3333
3415
|
const OBSERVE_VISIBILITY_TOKEN = new InjectionToken('OBSERVE_VISIBILITY_TOKEN');
|
|
3416
|
+
const signalVisibilityChangeClasses = (cfg) => ({
|
|
3417
|
+
[`${cfg.name}--is-left`]: computed(() => cfg.signal()?.isLeft),
|
|
3418
|
+
[`${cfg.name}--is-right`]: computed(() => cfg.signal()?.isRight),
|
|
3419
|
+
[`${cfg.name}--is-above`]: computed(() => cfg.signal()?.isAbove),
|
|
3420
|
+
[`${cfg.name}--is-below`]: computed(() => cfg.signal()?.isBelow),
|
|
3421
|
+
[`${cfg.name}--is-visible`]: computed(() => cfg.signal()?.visible),
|
|
3422
|
+
});
|
|
3334
3423
|
class ObserveVisibilityDirective {
|
|
3335
3424
|
constructor() {
|
|
3336
3425
|
this._destroy$ = createDestroy();
|
|
3337
3426
|
this._elementRef = inject(ElementRef);
|
|
3338
3427
|
this._intersectionObserverService = inject(IntersectionObserverService);
|
|
3339
|
-
this.
|
|
3428
|
+
this.visibilityChange = signal(null);
|
|
3340
3429
|
this.etObserveVisibility = new EventEmitter();
|
|
3430
|
+
signalHostClasses(signalVisibilityChangeClasses({
|
|
3431
|
+
name: 'et-observe-visibility',
|
|
3432
|
+
signal: this.visibilityChange,
|
|
3433
|
+
}));
|
|
3341
3434
|
}
|
|
3342
3435
|
ngAfterViewInit() {
|
|
3343
3436
|
this._intersectionObserverService
|
|
@@ -3360,12 +3453,12 @@ class ObserveVisibilityDirective {
|
|
|
3360
3453
|
entry,
|
|
3361
3454
|
};
|
|
3362
3455
|
this.etObserveVisibility.emit(data);
|
|
3363
|
-
this.
|
|
3456
|
+
this.visibilityChange.set(data);
|
|
3364
3457
|
}))
|
|
3365
3458
|
.subscribe();
|
|
3366
3459
|
}
|
|
3367
3460
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: ObserveVisibilityDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
3368
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.5", type: ObserveVisibilityDirective, isStandalone: true, selector: "[etObserveVisibility]", outputs: { etObserveVisibility: "etObserveVisibility" }, host: {
|
|
3461
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.5", type: ObserveVisibilityDirective, isStandalone: true, selector: "[etObserveVisibility]", outputs: { etObserveVisibility: "etObserveVisibility" }, host: { classAttribute: "et-observe-visibility" }, providers: [
|
|
3369
3462
|
{
|
|
3370
3463
|
provide: OBSERVE_VISIBILITY_TOKEN,
|
|
3371
3464
|
useExisting: ObserveVisibilityDirective,
|
|
@@ -3385,10 +3478,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.5", ngImpor
|
|
|
3385
3478
|
],
|
|
3386
3479
|
host: {
|
|
3387
3480
|
class: 'et-observe-visibility',
|
|
3388
|
-
'[class.et-observe-visibility--is-visible]': 'isIntersecting',
|
|
3389
3481
|
},
|
|
3390
3482
|
}]
|
|
3391
|
-
}], propDecorators: { etObserveVisibility: [{
|
|
3483
|
+
}], ctorParameters: function () { return []; }, propDecorators: { etObserveVisibility: [{
|
|
3392
3484
|
type: Output
|
|
3393
3485
|
}] } });
|
|
3394
3486
|
|
|
@@ -4016,5 +4108,5 @@ const Validators = {
|
|
|
4016
4108
|
* Generated bundle index. Do not edit.
|
|
4017
4109
|
*/
|
|
4018
4110
|
|
|
4019
|
-
export { ANIMATABLE_TOKEN, ANIMATED_IF_TOKEN, ANIMATED_LIFECYCLE_TOKEN, AT_LEAST_ONE_REQUIRED, ActiveSelectionModel, AnimatableDirective, AnimatedIfDirective, AnimatedLifecycleDirective, AnimatedOverlayDirective, ClickObserverFactory, ClickObserverService, ClickOutsideDirective, ContentObserverService, CursorDragScrollDirective, DEFAULT_VIEWPORT_CONFIG, DELAYABLE_TOKEN, DelayableDirective, ET_PROPERTY_REMOVED, FocusVisibleService, IS_ACTIVE_ELEMENT, IS_ARRAY_NOT_EMPTY, IS_ELEMENT, IS_EMAIL, IntersectionObserverFactory, IntersectionObserverService, IsActiveElementDirective, IsArrayNotEmpty, IsElementDirective, IsEmail, KeyPressManager, LetContext, LetDirective, MUST_MATCH, Memo, MustMatch, MutationObserverFactory, NormalizeGameResultTypePipe, NormalizeMatchParticipantsPipe, NormalizeMatchScorePipe, NormalizeMatchStatePipe, NormalizeMatchTypePipe, OBSERVE_SCROLL_STATE, OBSERVE_VISIBILITY_TOKEN, ObserveContentDirective, ObserveResizeDirective, ObserveScrollStateDirective, ObserveVisibilityDirective, RUNTIME_ERROR_NO_DATA, RepeatDirective, ResizeObserverFactory, ResizeObserverService, RouterStateService, RuntimeError, SCROLL_OBSERVER_FIRST_ELEMENT_CLASS, SCROLL_OBSERVER_IGNORE_TARGET_CLASS, SCROLL_OBSERVER_LAST_ELEMENT_CLASS, SCROLL_OBSERVER_OBSERVING_FIRST_ELEMENT_CLASS, SCROLL_OBSERVER_OBSERVING_LAST_ELEMENT_CLASS, SEO_DIRECTIVE_TOKEN, ScrollObserverFirstElementDirective, ScrollObserverIgnoreTargetDirective, ScrollObserverLastElementDirective, SelectionModel, SeoDirective, SmartBlockScrollStrategy, StructuredDataComponent, ToArrayPipe, TypedQueryList, VIEWPORT_CONFIG, ValidateAtLeastOneRequired, Validators, ViewportService, clamp, clone, cloneFormGroup, createDestroy, createFlipAnimation, createFlipAnimationGroup, createMediaQueryObservable, createMutationObservable, createReactiveBindings, createResizeObservable, deleteCookie, elementCanScroll, equal, forceReflow, formatRuntimeError, fromNextFrame, getCookie, getDomain, getElementVisibleStates, getGroupMatchPoints, getGroupMatchScore, getKnockoutMatchScore, getMatchScoreSubLine, hasCookie, isElementVisible, isEmptyArray, isGroupMatch, isKnockoutMatch, isObjectArray, isPrimitiveArray, mergeSeoConfig, nextFrame, normalizeGameResultType, normalizeMatchParticipant, normalizeMatchParticipants, normalizeMatchScore, normalizeMatchState, normalizeMatchType, provideViewportConfig, round, routerDisableScrollTop, scrollToElement, setCookie, toArray, toArrayTrackByFn };
|
|
4111
|
+
export { ANIMATABLE_TOKEN, ANIMATED_IF_TOKEN, ANIMATED_LIFECYCLE_TOKEN, AT_LEAST_ONE_REQUIRED, ActiveSelectionModel, AnimatableDirective, AnimatedIfDirective, AnimatedLifecycleDirective, AnimatedOverlayDirective, ClickObserverFactory, ClickObserverService, ClickOutsideDirective, ContentObserverService, CursorDragScrollDirective, DEFAULT_VIEWPORT_CONFIG, DELAYABLE_TOKEN, DelayableDirective, ET_PROPERTY_REMOVED, FocusVisibleService, IS_ACTIVE_ELEMENT, IS_ARRAY_NOT_EMPTY, IS_ELEMENT, IS_EMAIL, IntersectionObserverFactory, IntersectionObserverService, IsActiveElementDirective, IsArrayNotEmpty, IsElementDirective, IsEmail, KeyPressManager, LetContext, LetDirective, MUST_MATCH, Memo, MustMatch, MutationObserverFactory, NormalizeGameResultTypePipe, NormalizeMatchParticipantsPipe, NormalizeMatchScorePipe, NormalizeMatchStatePipe, NormalizeMatchTypePipe, OBSERVE_SCROLL_STATE, OBSERVE_VISIBILITY_TOKEN, ObserveContentDirective, ObserveResizeDirective, ObserveScrollStateDirective, ObserveVisibilityDirective, RUNTIME_ERROR_NO_DATA, RepeatDirective, ResizeObserverFactory, ResizeObserverService, RouterStateService, RuntimeError, SCROLL_OBSERVER_FIRST_ELEMENT_CLASS, SCROLL_OBSERVER_IGNORE_TARGET_CLASS, SCROLL_OBSERVER_LAST_ELEMENT_CLASS, SCROLL_OBSERVER_OBSERVING_FIRST_ELEMENT_CLASS, SCROLL_OBSERVER_OBSERVING_LAST_ELEMENT_CLASS, SEO_DIRECTIVE_TOKEN, ScrollObserverFirstElementDirective, ScrollObserverIgnoreTargetDirective, ScrollObserverLastElementDirective, SelectionModel, SeoDirective, SmartBlockScrollStrategy, StructuredDataComponent, ToArrayPipe, TypedQueryList, VIEWPORT_CONFIG, ValidateAtLeastOneRequired, Validators, ViewportService, clamp, clone, cloneFormGroup, createDestroy, createFlipAnimation, createFlipAnimationGroup, createMediaQueryObservable, createMutationObservable, createReactiveBindings, createResizeObservable, deleteCookie, elementCanScroll, equal, forceReflow, formatRuntimeError, fromNextFrame, getCookie, getDomain, getElementVisibleStates, getGroupMatchPoints, getGroupMatchScore, getKnockoutMatchScore, getMatchScoreSubLine, hasCookie, isElementVisible, isEmptyArray, isGroupMatch, isKnockoutMatch, isObjectArray, isPrimitiveArray, mergeSeoConfig, nextFrame, normalizeGameResultType, normalizeMatchParticipant, normalizeMatchParticipants, normalizeMatchScore, normalizeMatchState, normalizeMatchType, provideViewportConfig, round, routerDisableScrollTop, scrollToElement, setCookie, signalAttributes, signalClasses, signalHostAttributes, signalHostClasses, signalHostStyle, signalStyle, signalVisibilityChangeClasses, toArray, toArrayTrackByFn };
|
|
4020
4112
|
//# sourceMappingURL=ethlete-core.mjs.map
|