@ethlete/core 2.3.0 → 2.4.1

package/lib/services/router-state.service.d.ts

@@ -1,22 +1,64 @@
 import { Data, Params } from '@angular/router';
 import { Observable } from 'rxjs';
 import * as i0 from "@angular/core";
-export declare const routerDisableScrollTop: (config?: {
+declare const ET_DISABLE_SCROLL_TOP: unique symbol;
+declare const ET_DISABLE_SCROLL_TOP_AS_RETURN_ROUTE: unique symbol;
+declare const ET_DISABLE_SCROLL_TOP_ON_PATH_PARAM_CHANGE: unique symbol;
+export interface RouterDisableScrollTopConfig {
+    /**
+     * Whether to disable scroll to top ONLY when navigating back to this route.
+     * @default false
+     */
     asReturnRoute?: boolean;
-}) => {
-    disableScrollTop: boolean;
-    disableScrollTopAsReturnRoute?: undefined;
+    /**
+     * Whether to disable scroll to top when a path param changes.
+     * @default false
+     */
+    onPathParamChange?: boolean;
+}
+export declare const routerDisableScrollTop: (config?: RouterDisableScrollTopConfig) => {
+    [ET_DISABLE_SCROLL_TOP_ON_PATH_PARAM_CHANGE]?: boolean | undefined;
+    [ET_DISABLE_SCROLL_TOP]: boolean;
 } | {
-    disableScrollTopAsReturnRoute: boolean;
-    disableScrollTop?: undefined;
+    [ET_DISABLE_SCROLL_TOP_ON_PATH_PARAM_CHANGE]?: boolean | undefined;
+    [ET_DISABLE_SCROLL_TOP_AS_RETURN_ROUTE]: boolean;
 };
 export declare const ET_PROPERTY_REMOVED: unique symbol;
+export interface ScrollEnhancementsConfig {
+    /**
+     * The scrollable container.
+     * @default document.documentElement
+     */
+    scrollElement?: HTMLElement;
+    /**
+     * A list of query params that should trigger a scroll to top.
+     * @default []
+     * @example ['page'] // will scroll to top when the page query param changes
+     */
+    queryParamTriggerList?: string[];
+    /**
+     * Config for fragment scrolling.
+     */
+    fragment?: {
+        /**
+         * Enable fragment scrolling (scroll to element with id)
+         * @default false
+         */
+        enabled?: boolean;
+        /**
+         * Whether to use smooth scrolling or not.
+         * @default false
+         */
+        smooth?: boolean;
+    };
+}
 export declare class RouterStateService {
     private _isScrollTopOnNavigationEnabled;
     private readonly _router;
     private readonly _route$;
     private readonly _state$;
     get route$(): Observable<string>;
+    get route(): string;
     get state$(): Observable<{
         data: Data;
         pathParams: Params;
@@ -45,14 +87,7 @@ export declare class RouterStateService {
     get queryParamChanges$(): Observable<Partial<Params>>;
     get pathParamChanges$(): Observable<Partial<Params>>;
     constructor();
-    enableScrollEnhancements(config?: {
-        scrollElement?: HTMLElement;
-        queryParamTriggerList?: string[];
-        fragment?: {
-            enabled?: boolean;
-            smooth?: boolean;
-        };
-    }): void;
+    enableScrollEnhancements(config?: ScrollEnhancementsConfig): void;
     selectQueryParam<T = string | undefined>(key: string): Observable<T>;
     selectPathParam<T = string | undefined>(key: string): Observable<T>;
     selectData<T = unknown>(key: string): Observable<T>;
@@ -60,3 +95,4 @@ export declare class RouterStateService {
     static ɵfac: i0.ɵɵFactoryDeclaration<RouterStateService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<RouterStateService>;
 }
+export {};

package/lib/services/viewport.service.d.ts

@@ -2,8 +2,15 @@ import { BreakpointObserver } from '@angular/cdk/layout';
 import { Observable } from 'rxjs';
 import { Breakpoint, ViewportConfig } from '../types';
 import * as i0 from "@angular/core";
+interface Size {
+    width: number;
+    height: number;
+}
 export declare class ViewportService {
     private _breakpointObserver;
+    private readonly _resizeObserverService;
+    private readonly _viewportMonitorStop$;
+    private _isViewportMonitorEnabled;
     private _viewportConfig;
     private _isXs$;
     private _isSm$;
@@ -11,6 +18,8 @@ export declare class ViewportService {
     private _isLg$;
     private _isXl$;
     private _is2Xl$;
+    private _viewportSize$;
+    private _scrollbarSize$;
     get isXs$(): Observable<boolean>;
     get isXs(): boolean;
     get isSm$(): Observable<boolean>;
@@ -23,6 +32,10 @@ export declare class ViewportService {
     get isXl(): boolean;
     get is2Xl$(): Observable<boolean>;
     get is2Xl(): boolean;
+    get viewportSize$(): Observable<Size | null>;
+    get viewportSize(): Size | null;
+    get scrollbarSize$(): Observable<Size | null>;
+    get scrollbarSize(): Size | null;
     currentViewport$: Observable<"xs" | "sm" | "md" | "lg" | "xl" | "2xl">;
     get currentViewport(): "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
     constructor(_viewportConfig: ViewportConfig | null, _breakpointObserver: BreakpointObserver);
@@ -34,6 +47,15 @@ export declare class ViewportService {
         min?: number | Breakpoint;
         max?: number | Breakpoint;
     }): boolean;
+    /**
+     * Applies size CSS variables to the documentElement in pixels.
+     * - `--et-vw`: viewport width excluding scrollbar width
+     * - `--et-vh`: viewport height excluding scrollbar height
+     * - `--et-sw`: scrollbar width
+     * - `--et-sh`: scrollbar height
+     */
+    monitorViewport(): void;
+    unmonitorViewport(): void;
     private _observeDefaultBreakpoints;
     private _getViewportSize;
     private _buildMediaQuery;
@@ -41,3 +63,4 @@ export declare class ViewportService {
     static ɵfac: i0.ɵɵFactoryDeclaration<ViewportService, [{ optional: true; }, null]>;
     static ɵprov: i0.ɵɵInjectableDeclaration<ViewportService>;
 }
+export {};

package/package.json

@@ -1,19 +1,19 @@
 {
   "name": "@ethlete/core",
-  "version": "2.3.0",
+  "version": "2.4.1",
   "dependencies": {
     "tslib": "^2.5.0"
   },
   "peerDependencies": {
     "@angular/common": "^15.2.1 || ^16.0.0",
     "@angular/core": "^15.2.1 || ^16.0.0",
-    "@angular/platform-browser": "16.0.2",
+    "@angular/platform-browser": "16.0.4",
     "@ethlete/types": "1.1.1",
     "rxjs": "7.8.1",
-    "@angular/cdk": "16.0.1",
-    "@popperjs/core": "2.11.7",
-    "@angular/router": "16.0.2",
-    "@angular/forms": "16.0.2"
+    "@angular/cdk": "16.0.3",
+    "@popperjs/core": "2.11.8",
+    "@angular/router": "16.0.4",
+    "@angular/forms": "16.0.4"
   },
   "module": "fesm2022/ethlete-core.mjs",
   "typings": "index.d.ts",