@ethlete/core 2.7.3 → 2.8.0

package/fesm2022/ethlete-core.mjs

@@ -414,6 +414,12 @@ const getDomain = () => {
     if (hostname.includes('localhost')) {
         return 'localhost';
     }
+    const hostIsIP = hostname.match(
+    // eslint-disable-next-line no-useless-escape
+    /^(\d{1,3}\.){3}\d{1,3}$/);
+    if (hostIsIP) {
+        return hostname;
+    }
     const splitHost = hostname.split('.');
     if (splitHost.length > 2) {
         return `${splitHost[splitHost.length - 2]}.${splitHost[splitHost.length - 1]}`;
@@ -556,6 +562,42 @@ const createMediaQueryObservable = (query) => {
     return observable;
 };
 
+const createMutationObservable = (config) => {
+    const elements = Array.isArray(config.elements) ? config.elements : [config.elements];
+    return new Observable((obs) => {
+        const observer = new MutationObserver((mutations) => {
+            if (config.options?.styleIgnoreList) {
+                const allowedMutations = [];
+                for (const mutation of mutations) {
+                    if (mutation.type === 'attributes') {
+                        const attributeName = mutation.attributeName;
+                        if (!attributeName || attributeName !== 'style')
+                            continue;
+                        const oldValue = mutation.oldValue;
+                        const newValue = mutation.target.getAttribute('style');
+                        const oldValueStyles = oldValue?.split(';').map((s) => s.trim()) ?? [];
+                        const newValueStyles = newValue?.split(';').map((s) => s.trim()) ?? [];
+                        const changedStyles = newValueStyles.filter((s) => !oldValueStyles.includes(s));
+                        if (changedStyles.some((s) => config.options?.styleIgnoreList?.includes(s.split(':')[0])))
+                            continue;
+                        allowedMutations.push(mutation);
+                    }
+                }
+                if (allowedMutations.length) {
+                    obs.next(allowedMutations);
+                }
+            }
+            else {
+                obs.next(mutations);
+            }
+        });
+        for (const element of elements) {
+            observer.observe(element, config.options);
+        }
+        return () => observer.disconnect();
+    });
+};
+
 const isAttributeRenderBinding = (value) => typeof value === 'boolean';
 const isAttributeValueBinding = (value) => typeof value === 'object';
 const createReactiveBindings = (...values) => {
@@ -1922,9 +1964,12 @@ class ViewportService {
             .pipe(tap((e) => {
             const width = e[0].contentRect.width;
             const height = e[0].contentRect.height;
-            document.documentElement.style.setProperty('--et-vw', `${width}px`);
-            document.documentElement.style.setProperty('--et-vh', `${height}px`);
-            this._viewportSize$.next({ width, height });
+            const obj = { width, height };
+            if (equal(obj, this._viewportSize$.value))
+                return;
+            document.documentElement.style.setProperty('--et-vw', `${obj.width}px`);
+            document.documentElement.style.setProperty('--et-vh', `${obj.height}px`);
+            this._viewportSize$.next(obj);
         }), finalize(() => {
             document.documentElement.style.removeProperty('--et-vw');
             document.documentElement.style.removeProperty('--et-vh');
@@ -1942,9 +1987,12 @@ class ViewportService {
             .observe(scrollbarRuler)
             .pipe(tap((e) => {
             const size = e[0].contentRect.width;
-            document.documentElement.style.setProperty('--et-sw', `${100 - size}px`);
-            document.documentElement.style.setProperty('--et-sh', `${100 - size}px`);
-            this._scrollbarSize$.next({ width: 100 - size, height: 100 - size });
+            const obj = { width: 100 - size, height: 100 - size };
+            if (equal(obj, this._scrollbarSize$.value))
+                return;
+            document.documentElement.style.setProperty('--et-sw', `${obj.width}px`);
+            document.documentElement.style.setProperty('--et-sh', `${obj.height}px`);
+            this._scrollbarSize$.next(obj);
         }), finalize(() => {
             document.body.removeChild(scrollbarRuler);
             document.documentElement.style.removeProperty('--et-vw');
@@ -2468,7 +2516,7 @@ class CursorDragScrollDirective {
             .pipe(tap((e) => this._mouseMoveHandler(e)), takeUntil(this._mouseUp$), takeUntil(this._destroy$))
             .subscribe();
         fromEvent(document, 'mouseup')
-            .pipe(tap((e) => this._mouseUpHandler(e)), take(1), takeUntil(this._destroy$))
+            .pipe(tap(() => this._mouseUpHandler()), take(1), takeUntil(this._destroy$))
             .subscribe();
     }
     _mouseMoveHandler(e) {
@@ -2507,11 +2555,7 @@ class CursorDragScrollDirective {
             }
         }
     }
-    _mouseUpHandler(e) {
-        if (this._isScrolling) {
-            e.preventDefault();
-            e.stopImmediatePropagation();
-        }
+    _mouseUpHandler() {
         this._mouseUp$.next(true);
         this._isScrolling = false;
         if (!this._elementRef?.nativeElement) {
@@ -2852,12 +2896,8 @@ class ObserveScrollStateDirective {
         this._elementRef = inject(ElementRef);
         this._contentObserverService = inject(ContentObserverService);
         this._resizeObserverService = inject(ResizeObserverService);
-        this._observedChildren = {
-            first: this._firstCurrentChild,
-            last: this._lastCurrentChild,
-        };
         this.rootMargin = 0;
-        this._threshold = [0.99999, 0.9999, 0.999, 0.99, 1];
+        this._threshold = [0.99, 0.99999, 0.9999, 0.999, 1];
         this._intersectionObserver = null;
         this.valueChange = new EventEmitter();
     }
@@ -2887,6 +2927,16 @@ class ObserveScrollStateDirective {
         }
         this._threshold = numberAttribute(value);
     }
+    get _observerElements() {
+        const firstEl = this._elementRef.nativeElement.querySelector(`.${SCROLL_OBSERVER_FIRST_ELEMENT_CLASS}`);
+        const lastEl = this._elementRef.nativeElement.querySelector(`.${SCROLL_OBSERVER_LAST_ELEMENT_CLASS}`);
+        if (!firstEl || !lastEl)
+            return null;
+        return {
+            first: firstEl,
+            last: lastEl,
+        };
+    }
     ngOnInit() {
         this._contentObserverService
             .observe(this._elementRef.nativeElement)
@@ -2912,8 +2962,7 @@ class ObserveScrollStateDirective {
             !this._firstCurrentChild ||
             !this._lastCurrentChild ||
             !elementCanScroll(this._elementRef.nativeElement)) {
-            this._unobserveChild('first');
-            this._unobserveChild('last');
+            this._unobserve();
             this.valueChange.emit({
                 isAtStart: true,
                 isAtEnd: true,
@@ -2922,15 +2971,16 @@ class ObserveScrollStateDirective {
         }
         else {
             this._intersectionObserver = this._initiateIntersectionObserver();
-            this._observeChild('first', this._firstCurrentChild);
-            this._observeChild('last', this._lastCurrentChild);
+            this._observe();
         }
     }
     _initiateIntersectionObserver() {
         const observer = new IntersectionObserver((entries) => {
-            const { first, last } = this._observedChildren;
-            const isAtStart = entries.find((entry) => entry.target === first)?.isIntersecting ?? false;
-            const isAtEnd = entries.find((entry) => entry.target === last)?.isIntersecting ?? false;
+            const elements = this._observerElements;
+            if (!elements)
+                return;
+            const isAtStart = entries.find((entry) => entry.target === elements.first)?.isIntersecting ?? false;
+            const isAtEnd = entries.find((entry) => entry.target === elements.last)?.isIntersecting ?? false;
             this.valueChange.emit({
                 isAtStart,
                 isAtEnd,
@@ -2943,24 +2993,23 @@ class ObserveScrollStateDirective {
         });
         return observer;
     }
-    _observeChild(child, element) {
-        this._intersectionObserver?.observe(element);
-        this._observedChildren[child] = element;
-        if (child === 'first') {
-            element.classList.add(SCROLL_OBSERVER_OBSERVING_FIRST_ELEMENT_CLASS);
-        }
-        else {
-            element.classList.add(SCROLL_OBSERVER_OBSERVING_LAST_ELEMENT_CLASS);
-        }
-    }
-    _unobserveChild(child) {
-        const observedChild = this._observedChildren[child];
-        if (!observedChild) {
+    _observe() {
+        const elements = this._observerElements;
+        if (!elements)
             return;
-        }
-        observedChild.classList.remove(SCROLL_OBSERVER_OBSERVING_FIRST_ELEMENT_CLASS, SCROLL_OBSERVER_OBSERVING_LAST_ELEMENT_CLASS);
-        this._intersectionObserver?.unobserve(observedChild);
-        this._observedChildren[child] = null;
+        this._intersectionObserver?.observe(elements.first);
+        this._intersectionObserver?.observe(elements.last);
+        elements.first.classList.add(SCROLL_OBSERVER_OBSERVING_FIRST_ELEMENT_CLASS);
+        elements.last.classList.add(SCROLL_OBSERVER_OBSERVING_LAST_ELEMENT_CLASS);
+    }
+    _unobserve() {
+        const elements = this._observerElements;
+        if (!elements)
+            return;
+        this._intersectionObserver?.unobserve(elements.first);
+        this._intersectionObserver?.unobserve(elements.last);
+        elements.first.classList.remove(SCROLL_OBSERVER_OBSERVING_FIRST_ELEMENT_CLASS);
+        elements.last.classList.remove(SCROLL_OBSERVER_OBSERVING_LAST_ELEMENT_CLASS);
     }
     _clearIntersectionObserver() {
         this._intersectionObserver?.disconnect();
@@ -3613,5 +3662,5 @@ const Validators = {
  * Generated bundle index. Do not edit.
  */
 
-export { ANIMATABLE_TOKEN, ANIMATED_LIFECYCLE_TOKEN, ActiveSelectionModel, AnimatableDirective, AnimatedLifecycleDirective, AnimatedOverlayDirective, BehaviorSubjectWithSubscriberCount, 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, IsActiveElementDirective, IsArrayNotEmpty, IsElementDirective, IsEmail, LetContext, LetDirective, MUST_MATCH, Memo, MustMatch, MutationObserverFactory, NormalizeGameResultTypePipe, NormalizeMatchParticipantsPipe, NormalizeMatchScorePipe, NormalizeMatchStatePipe, NormalizeMatchTypePipe, OBSERVE_SCROLL_STATE, ObserveContentDirective, ObserveResizeDirective, ObserveScrollStateDirective, 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, Validators, ViewportService, clamp, clone, createDestroy, createFlipAnimation, createFlipAnimationGroup, createMediaQueryObservable, createReactiveBindings, deleteCookie, elementCanScroll, equal, forceReflow, formatRuntimeError, fromNextFrame, getCookie, getDomain, getElementVisibleStates, getGroupMatchPoints, getGroupMatchScore, getKnockoutMatchScore, getMatchScoreSubLine, hasCookie, isElementVisible, isGroupMatch, isKnockoutMatch, mergeSeoConfig, nextFrame, normalizeGameResultType, normalizeMatchParticipant, normalizeMatchParticipants, normalizeMatchScore, normalizeMatchState, normalizeMatchType, provideViewportConfig, round, routerDisableScrollTop, scrollToElement, setCookie, toArray, toArrayTrackByFn };
+export { ANIMATABLE_TOKEN, ANIMATED_LIFECYCLE_TOKEN, ActiveSelectionModel, AnimatableDirective, AnimatedLifecycleDirective, AnimatedOverlayDirective, BehaviorSubjectWithSubscriberCount, 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, IsActiveElementDirective, IsArrayNotEmpty, IsElementDirective, IsEmail, LetContext, LetDirective, MUST_MATCH, Memo, MustMatch, MutationObserverFactory, NormalizeGameResultTypePipe, NormalizeMatchParticipantsPipe, NormalizeMatchScorePipe, NormalizeMatchStatePipe, NormalizeMatchTypePipe, OBSERVE_SCROLL_STATE, ObserveContentDirective, ObserveResizeDirective, ObserveScrollStateDirective, 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, Validators, ViewportService, clamp, clone, createDestroy, createFlipAnimation, createFlipAnimationGroup, createMediaQueryObservable, createMutationObservable, createReactiveBindings, deleteCookie, elementCanScroll, equal, forceReflow, formatRuntimeError, fromNextFrame, getCookie, getDomain, getElementVisibleStates, getGroupMatchPoints, getGroupMatchScore, getKnockoutMatchScore, getMatchScoreSubLine, hasCookie, isElementVisible, isGroupMatch, isKnockoutMatch, mergeSeoConfig, nextFrame, normalizeGameResultType, normalizeMatchParticipant, normalizeMatchParticipants, normalizeMatchScore, normalizeMatchState, normalizeMatchType, provideViewportConfig, round, routerDisableScrollTop, scrollToElement, setCookie, toArray, toArrayTrackByFn };
 //# sourceMappingURL=ethlete-core.mjs.map