@yuuvis/client-core 2.3.4 → 2.3.5

package/fesm2022/yuuvis-client-core.mjs

@@ -3,7 +3,7 @@ import { TranslateService, TranslateLoader, MissingTranslationHandler, Translate
 export { TranslateDirective, TranslateLoader, TranslateModule, TranslatePipe, TranslateService } from '@ngx-translate/core';
 import { HttpErrorResponse, HttpClient, HttpHeaders, HttpParams, HttpRequest, HttpResponse, HttpEventType, provideHttpClient, withInterceptors } from '@angular/common/http';
 import * as i0 from '@angular/core';
-import { inject, Injectable, InjectionToken, Inject, Directive, Pipe, importProvidersFrom, provideAppInitializer } from '@angular/core';
+import { inject, Injectable, InjectionToken, Inject, signal, Directive, Pipe, importProvidersFrom, provideAppInitializer } from '@angular/core';
 import { tap, finalize, shareReplay, catchError, map, switchMap, first, filter, scan, delay } from 'rxjs/operators';
 import { EMPTY, of, forkJoin, Observable, ReplaySubject, Subject, fromEvent, BehaviorSubject, tap as tap$1, map as map$1, merge, filter as filter$1, debounceTime, throwError, isObservable, switchMap as switchMap$1 } from 'rxjs';
 import { StorageMap } from '@ngx-pwa/local-storage';
@@ -3260,6 +3260,7 @@ class DeviceService {
     #resize$;
     #screen;
     #screenSource;
+    #supportsSmallScreens;
     constructor() {
         this.#deviceDetectorService = inject(DeviceDetectorService);
         this.#upperScreenBoundary = {
@@ -3271,6 +3272,13 @@ class DeviceService {
         this.#resize$ = fromEvent(window, 'resize').pipe(debounceTime(this.#getDebounceTime()));
         this.#screenSource = new ReplaySubject(1);
         this.screenChange$ = this.#screenSource.asObservable();
+        /**
+         * Signal to indicate if the screen size is small (e.g. mobile phone).
+         * This will only be triggered if `supportsSmallScreens` is set to true.
+         * Major components will use this metric to adapt to 'small screen behavior' and so can you
+         */
+        this.smallScreenLayout = signal(false);
+        this.#supportsSmallScreens = signal(false);
         /**
          * if the device is a mobile device (android / iPhone / windows-phone etc)
          */
@@ -3289,7 +3297,8 @@ class DeviceService {
             this.#setScreen();
         });
     }
-    init() {
+    init(supportsSmallScreens = false) {
+        this.#supportsSmallScreens.set(supportsSmallScreens);
         this.#setScreen();
     }
     #isTouchEnabled() {
@@ -3317,6 +3326,7 @@ class DeviceService {
             height: bounds.height
         };
         this.#screenSource.next(this.#screen);
+        this.smallScreenLayout.set(this.#supportsSmallScreens() && this.#screen.size === 's' && this.#screen.orientation === 'portrait');
         this.#setupDOM(this.#screen);
         // force change detection because resize will not be recognized by Angular in some cases
         // TODO: check: causes recursive ticks in some cases ...