@ethlete/core 1.5.0 → 1.6.0

package/fesm2020/ethlete-core.mjs

@@ -862,6 +862,86 @@ const elementCanScroll = (element) => {
     const { scrollHeight, clientHeight, scrollWidth, clientWidth } = element;
     return scrollHeight > clientHeight || scrollWidth > clientWidth;
 };
+const isElementVisible = (options) => {
+    let { container } = options;
+    const { element } = options;
+    if (!element || container === null) {
+        return null;
+    }
+    container || (container = document.documentElement);
+    const canScroll = elementCanScroll(container);
+    if (!canScroll) {
+        return { inline: true, block: true };
+    }
+    const elementRect = element.getBoundingClientRect();
+    const containerRect = container.getBoundingClientRect();
+    const elementInlineStart = elementRect.left;
+    const elementBlockStart = elementRect.top;
+    const containerInlineStart = containerRect.left;
+    const containerBlockStart = containerRect.top;
+    const elementInlineEnd = elementInlineStart + elementRect.width;
+    const elementBlockEnd = elementBlockStart + elementRect.height;
+    const containerInlineEnd = containerInlineStart + containerRect.width;
+    const containerBlockEnd = containerBlockStart + containerRect.height;
+    const isElementInlineVisible = elementInlineStart >= containerInlineStart && elementInlineEnd <= containerInlineEnd;
+    const isElementBlockVisible = elementBlockStart >= containerBlockStart && elementBlockEnd <= containerBlockEnd;
+    return { inline: isElementInlineVisible, block: isElementBlockVisible };
+};
+const scrollToElement = (options) => {
+    let { container } = options;
+    const { element, direction, behavior = 'smooth', origin = 'nearest' } = options;
+    if (!element || container === null) {
+        return;
+    }
+    container || (container = document.documentElement);
+    const canScroll = elementCanScroll(container);
+    if (!canScroll) {
+        return;
+    }
+    const elementRect = element.getBoundingClientRect();
+    const containerRect = container.getBoundingClientRect();
+    const elementInlineSize = elementRect.width;
+    const elementBlockSize = elementRect.height;
+    const containerInlineSize = containerRect.width;
+    const containerBlockSize = containerRect.height;
+    const elementInlineStart = elementRect.left;
+    const elementBlockStart = elementRect.top;
+    const containerInlineStart = containerRect.left;
+    const containerBlockStart = containerRect.top;
+    const elementInlineEnd = elementInlineStart + elementInlineSize;
+    const elementBlockEnd = elementBlockStart + elementBlockSize;
+    const containerInlineEnd = containerInlineStart + containerInlineSize;
+    const containerBlockEnd = containerBlockStart + containerBlockSize;
+    const elementInlineCenter = elementInlineStart + elementInlineSize / 2;
+    const elementBlockCenter = elementBlockStart + elementBlockSize / 2;
+    const containerInlineCenter = containerInlineStart + containerInlineSize / 2;
+    const containerBlockCenter = containerBlockStart + containerBlockSize / 2;
+    const elementInlineOrigin = origin === 'center' ? elementInlineCenter : origin === 'end' ? elementInlineEnd : elementInlineStart;
+    const elementBlockOrigin = origin === 'center' ? elementBlockCenter : origin === 'end' ? elementBlockEnd : elementBlockStart;
+    const containerInlineOrigin = origin === 'center' ? containerInlineCenter : origin === 'end' ? containerInlineEnd : containerInlineStart;
+    const containerBlockOrigin = origin === 'center' ? containerBlockCenter : origin === 'end' ? containerBlockEnd : containerBlockStart;
+    const inlineOffset = elementInlineOrigin - containerInlineOrigin;
+    const blockOffset = elementBlockOrigin - containerBlockOrigin;
+    let inlineScroll = direction === 'block' ? undefined : inlineOffset;
+    let blockScroll = direction === 'inline' ? undefined : blockOffset;
+    if (origin === 'nearest') {
+        const elVisible = isElementVisible({ element, container });
+        if (elVisible?.inline && elVisible?.block) {
+            return;
+        }
+        if (elVisible?.inline) {
+            inlineScroll = undefined;
+        }
+        if (elVisible?.block) {
+            blockScroll = undefined;
+        }
+    }
+    container.scrollTo({
+        left: inlineScroll,
+        top: blockScroll,
+        behavior,
+    });
+};
 
 const scrollBehaviorSupported = supportsScrollBehavior();
 class SmartBlockScrollStrategy {
@@ -1092,13 +1172,13 @@ class ViewportService {
         this._isLg$ = new BehaviorSubject(false);
         this._isXl$ = new BehaviorSubject(false);
         this._is2Xl$ = new BehaviorSubject(false);
-        this.currentViewport$ = combineLatest([this.isXs$, this.isSm$, this.isMd$, this.isLg$, this.isXl$, this.is2Xl$]).pipe(map((val) => this.getCurrentViewport(val)), shareReplay());
+        this.currentViewport$ = combineLatest([this.isXs$, this.isSm$, this.isMd$, this.isLg$, this.isXl$, this.is2Xl$]).pipe(map((val) => this.getCurrentViewport(val)), shareReplay(1));
         this._viewportConfig = _viewportConfig || DEFAULT_VIEWPORT_CONFIG;
         this._observeDefaultBreakpoints();
     }
     observe(options) {
         const mediaQuery = this._buildMediaQuery(options);
-        return this._breakpointObserver.observe(mediaQuery).pipe(map((x) => x.matches), shareReplay());
+        return this._breakpointObserver.observe(mediaQuery).pipe(map((x) => x.matches), shareReplay(1));
     }
     isMatched(options) {
         const mediaQuery = this._buildMediaQuery(options);
@@ -2639,5 +2719,5 @@ const Validators = {
  * Generated bundle index. Do not edit.
  */
 
-export { ANIMATABLE_TOKEN, ANIMATED_LIFECYCLE_TOKEN, AnimatableDirective, AnimatedLifecycleDirective, BehaviorSubjectWithSubscriberCount, 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, SmartBlockScrollStrategy, 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 };
+export { ANIMATABLE_TOKEN, ANIMATED_LIFECYCLE_TOKEN, AnimatableDirective, AnimatedLifecycleDirective, BehaviorSubjectWithSubscriberCount, 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, SmartBlockScrollStrategy, 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, isElementVisible, isGroupMatch, isKnockoutMatch, mergeSeoConfig, nextFrame, normalizeGameResultType, normalizeMatchParticipant, normalizeMatchParticipants, normalizeMatchScore, normalizeMatchState, normalizeMatchType, provideViewportConfig, routerDisableScrollTop, scrollToElement, setCookie, toArray, toArrayTrackByFn };
 //# sourceMappingURL=ethlete-core.mjs.map