@scion/components 18.0.1 → 18.1.0

package/README.md

@@ -9,7 +9,7 @@ The SCION Components is a collection of Angular components and directives primar
   Provides a viewport component with scrollbars that sit on top of the viewport client.
 
 - [**Dimension**][link-tool-dimension]\
-  Provides a directive for observing changes in the size of the host element.
+  Provides a set of tools for observing the size and position of an element.
 
 - [**Sashbox**][link-tool-sashbox]\
   Provides a sashbox component for splitting content into multiple parts, which the user can resize by moving the splitter between the parts.
@@ -37,4 +37,4 @@ License: EPL-2.0
 [link-tool-dimension]: https://github.com/SchweizerischeBundesbahnen/scion-toolkit/blob/master/docs/site/tools/dimension.md
 [link-tool-sashbox]: https://github.com/SchweizerischeBundesbahnen/scion-toolkit/blob/master/docs/site/tools/sashbox.md
 [link-tool-splitter]: https://github.com/SchweizerischeBundesbahnen/scion-toolkit/blob/master/docs/site/tools/splitter.md
-[link-tool-throbber]: https://github.com/SchweizerischeBundesbahnen/scion-toolkit/blob/master/docs/site/tools/throbber.md
+[link-tool-throbber]: https://github.com/SchweizerischeBundesbahnen/scion-toolkit/blob/master/docs/site/tools/throbber.md

package/dimension/bounding-client-rect.signal.d.ts

@@ -0,0 +1,23 @@
+import { ElementRef, Injector, Signal } from '@angular/core';
+/**
+ * Creates a signal observing the bounding box of an element.
+ *
+ * The bounding box includes the element's position relative to the top-left of the viewport and its size.
+ * Refer to https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect for more details.
+ *
+ * The element can be passed as a signal, enabling observation of view children in the component constructor.
+ *
+ * There is no native browser API to observe the position of an element. The signal uses {@link IntersectionObserver} and
+ * {@link ResizeObserver} to detect position changes. For tracking only size changes, use the {@link dimension} signal instead.
+ *
+ * Usage:
+ * - Must be called within an injection context or an injector provided. Destroying the injector will unsubscribe the signal.
+ * - Must not be called within a reactive context to avoid repeated subscriptions.
+ * - The element and the document root (`<html>`) must be positioned `relative` or `absolute`. If not, a warning is logged, and positioning changed to `relative`.
+ */
+export declare function boundingClientRect(elementLike: HTMLElement | ElementRef<HTMLElement> | Signal<HTMLElement | ElementRef<HTMLElement>>, options?: {
+    injector?: Injector;
+}): Signal<DOMRect>;
+export declare function boundingClientRect(elementLike: HTMLElement | ElementRef<HTMLElement> | Signal<HTMLElement | ElementRef<HTMLElement> | undefined>, options?: {
+    injector?: Injector;
+}): Signal<DOMRect | undefined>;

package/dimension/dimension.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Represents the dimension of an element.
+ */
+export interface SciDimension {
+    offsetWidth: number;
+    offsetHeight: number;
+    clientWidth: number;
+    clientHeight: number;
+    element: HTMLElement;
+}

package/dimension/dimension.directive.d.ts

@@ -1,8 +1,7 @@
+import { SciDimension } from './dimension';
 import * as i0 from "@angular/core";
 /**
- * Observes changes to the size of the host element.
- *
- * Upon subscription, emits the current size, and then continuously when the size changes. The Observable never completes.
+ * Observes the size of the host element.
  *
  * ---
  * Usage:
@@ -13,24 +12,14 @@ import * as i0 from "@angular/core";
  */
 export declare class SciDimensionDirective {
     /**
-     * Controls if to emit outside the Angular zone. Defaults to `false`.
+     * Controls if to output outside the Angular zone. Defaults to `false`.
      */
     emitOutsideAngular: import("@angular/core").InputSignal<boolean>;
     /**
-     * Upon subscription, emits the current size, and then continuously when the size changes. The Observable never completes.
+     * Outputs the size of the element.
      */
     dimensionChange: import("@angular/core").OutputEmitterRef<SciDimension>;
     constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<SciDimensionDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<SciDimensionDirective, "[sciDimension]", never, { "emitOutsideAngular": { "alias": "emitOutsideAngular"; "required": false; "isSignal": true; }; }, { "dimensionChange": "sciDimensionChange"; }, never, never, true, never>;
 }
-/**
- * Represents the dimension of an element.
- */
-export interface SciDimension {
-    offsetWidth: number;
-    offsetHeight: number;
-    clientWidth: number;
-    clientHeight: number;
-    element: HTMLElement;
-}

package/dimension/dimension.signal.d.ts

@@ -0,0 +1,19 @@
+import { ElementRef, Injector, Signal } from '@angular/core';
+import { SciDimension } from './dimension';
+/**
+ * Creates a signal observing the size of an element.
+ *
+ * The element can be passed as a signal, enabling observation of view children in the component constructor.
+ *
+ * The signal subscribes to the native {@link ResizeObserver} to monitor element size changes. Destroying the injection context will unsubscribe the observer.
+ *
+ * Usage:
+ * - Must be called within an injection context or an injector provided. Destroying the injector will unsubscribe the signal.
+ * - Must not be called within a reactive context to avoid repeated subscriptions.
+ */
+export declare function dimension(elementLike: HTMLElement | ElementRef<HTMLElement> | Signal<HTMLElement | ElementRef<HTMLElement>>, options?: {
+    injector?: Injector;
+}): Signal<SciDimension>;
+export declare function dimension(elementLike: HTMLElement | ElementRef<HTMLElement> | Signal<HTMLElement | ElementRef<HTMLElement> | undefined>, options?: {
+    injector?: Injector;
+}): Signal<SciDimension | undefined>;

package/dimension/public_api.d.ts

@@ -1,2 +1,5 @@
 export { SciDimensionModule } from './dimension.module';
-export { SciDimensionDirective, SciDimension } from './dimension.directive';
+export { SciDimensionDirective } from './dimension.directive';
+export { dimension } from './dimension.signal';
+export { boundingClientRect } from './bounding-client-rect.signal';
+export { SciDimension } from './dimension';

package/esm2022/dimension/bounding-client-rect.signal.mjs

@@ -0,0 +1,53 @@
+/*
+ * Copyright (c) 2018-2024 Swiss Federal Railways
+ *
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ */
+import { assertInInjectionContext, assertNotInReactiveContext, computed, effect, inject, Injector, isSignal, NgZone, signal, untracked } from '@angular/core';
+import { coerceElement } from '@angular/cdk/coercion';
+import { fromBoundingClientRect$ } from '@scion/toolkit/observable';
+import { subscribeInside } from '@scion/toolkit/operators';
+export function boundingClientRect(elementLike, options) {
+    assertNotInReactiveContext(boundingClientRect, 'Invoking `boundingClientRect` causes new subscriptions every time. Move `boundingClientRect` outside of the reactive context and read the signal value where needed.');
+    if (!options?.injector) {
+        assertInInjectionContext(boundingClientRect);
+    }
+    const injector = options?.injector ?? inject(Injector);
+    const zone = injector.get(NgZone);
+    const element = computed(() => coerceElement(isSignal(elementLike) ? elementLike() : elementLike));
+    const onBoundingBoxChange = signal(undefined, { equal: () => false });
+    // Subscribe to element bounding box changes.
+    effect(onCleanup => {
+        const el = element();
+        if (!el) {
+            return;
+        }
+        untracked(() => {
+            const subscription = fromBoundingClientRect$(el)
+                .pipe(subscribeInside(fn => zone.runOutsideAngular(fn)))
+                .subscribe(() => {
+                NgZone.assertNotInAngularZone();
+                onBoundingBoxChange.set();
+            });
+            onCleanup(() => subscription.unsubscribe());
+        });
+    }, { injector });
+    // Create signal that recomputes each time the bounding box changes.
+    return computed(() => {
+        const el = element();
+        if (!el) {
+            return undefined;
+        }
+        // Track bounding box.
+        onBoundingBoxChange();
+        return el.getBoundingClientRect();
+    }, { equal: isEqualDomRect });
+}
+function isEqualDomRect(a, b) {
+    return a?.top === b?.top && a?.right === b?.right && a?.bottom === b?.bottom && a?.left === b?.left;
+}
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYm91bmRpbmctY2xpZW50LXJlY3Quc2lnbmFsLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc2Npb24vY29tcG9uZW50cy9kaW1lbnNpb24vc3JjL2JvdW5kaW5nLWNsaWVudC1yZWN0LnNpZ25hbC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7R0FRRztBQUVILE9BQU8sRUFBQyx3QkFBd0IsRUFBRSwwQkFBMEIsRUFBRSxRQUFRLEVBQUUsTUFBTSxFQUFjLE1BQU0sRUFBRSxRQUFRLEVBQUUsUUFBUSxFQUFFLE1BQU0sRUFBRSxNQUFNLEVBQVUsU0FBUyxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQ2hMLE9BQU8sRUFBQyxhQUFhLEVBQUMsTUFBTSx1QkFBdUIsQ0FBQztBQUNwRCxPQUFPLEVBQUMsdUJBQXVCLEVBQUMsTUFBTSwyQkFBMkIsQ0FBQztBQUNsRSxPQUFPLEVBQUMsZUFBZSxFQUFDLE1BQU0sMEJBQTBCLENBQUM7QUFvQnpELE1BQU0sVUFBVSxrQkFBa0IsQ0FBQyxXQUE4RyxFQUFFLE9BQStCO0lBQ2hMLDBCQUEwQixDQUFDLGtCQUFrQixFQUFFLHNLQUFzSyxDQUFDLENBQUM7SUFDdk4sSUFBSSxDQUFDLE9BQU8sRUFBRSxRQUFRLEVBQUUsQ0FBQztRQUN2Qix3QkFBd0IsQ0FBQyxrQkFBa0IsQ0FBQyxDQUFDO0lBQy9DLENBQUM7SUFFRCxNQUFNLFFBQVEsR0FBRyxPQUFPLEVBQUUsUUFBUSxJQUFJLE1BQU0sQ0FBQyxRQUFRLENBQUMsQ0FBQztJQUN2RCxNQUFNLElBQUksR0FBRyxRQUFRLENBQUMsR0FBRyxDQUFDLE1BQU0sQ0FBQyxDQUFDO0lBQ2xDLE1BQU0sT0FBTyxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxhQUFhLENBQUMsUUFBUSxDQUFDLFdBQVcsQ0FBQyxDQUFDLENBQUMsQ0FBQyxXQUFXLEVBQUUsQ0FBQyxDQUFDLENBQUMsV0FBVyxDQUFDLENBQUMsQ0FBQztJQUNuRyxNQUFNLG1CQUFtQixHQUFHLE1BQU0sQ0FBTyxTQUFTLEVBQUUsRUFBQyxLQUFLLEVBQUUsR0FBRyxFQUFFLENBQUMsS0FBSyxFQUFDLENBQUMsQ0FBQztJQUUxRSw2Q0FBNkM7SUFDN0MsTUFBTSxDQUFDLFNBQVMsQ0FBQyxFQUFFO1FBQ2pCLE1BQU0sRUFBRSxHQUFHLE9BQU8sRUFBRSxDQUFDO1FBQ3JCLElBQUksQ0FBQyxFQUFFLEVBQUUsQ0FBQztZQUNSLE9BQU87UUFDVCxDQUFDO1FBRUQsU0FBUyxDQUFDLEdBQUcsRUFBRTtZQUNiLE1BQU0sWUFBWSxHQUFHLHVCQUF1QixDQUFDLEVBQUUsQ0FBQztpQkFDN0MsSUFBSSxDQUFDLGVBQWUsQ0FBQyxFQUFFLENBQUMsRUFBRSxDQUFDLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDO2lCQUN2RCxTQUFTLENBQUMsR0FBRyxFQUFFO2dCQUNkLE1BQU0sQ0FBQyxzQkFBc0IsRUFBRSxDQUFDO2dCQUNoQyxtQkFBbUIsQ0FBQyxHQUFHLEVBQUUsQ0FBQztZQUM1QixDQUFDLENBQUMsQ0FBQztZQUNMLFNBQVMsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxZQUFZLENBQUMsV0FBVyxFQUFFLENBQUMsQ0FBQztRQUM5QyxDQUFDLENBQUMsQ0FBQztJQUNMLENBQUMsRUFBRSxFQUFDLFFBQVEsRUFBQyxDQUFDLENBQUM7SUFFZixvRUFBb0U7SUFDcEUsT0FBTyxRQUFRLENBQUMsR0FBRyxFQUFFO1FBQ25CLE1BQU0sRUFBRSxHQUFHLE9BQU8sRUFBRSxDQUFDO1FBQ3JCLElBQUksQ0FBQyxFQUFFLEVBQUUsQ0FBQztZQUNSLE9BQU8sU0FBUyxDQUFDO1FBQ25CLENBQUM7UUFFRCxzQkFBc0I7UUFDdEIsbUJBQW1CLEVBQUUsQ0FBQztRQUV0QixPQUFPLEVBQUUsQ0FBQyxxQkFBcUIsRUFBRSxDQUFDO0lBQ3BDLENBQUMsRUFBRSxFQUFDLEtBQUssRUFBRSxjQUFjLEVBQUMsQ0FBQyxDQUFDO0FBQzlCLENBQUM7QUFFRCxTQUFTLGNBQWMsQ0FBQyxDQUFzQixFQUFFLENBQXNCO0lBQ3BFLE9BQU8sQ0FBQyxFQUFFLEdBQUcsS0FBSyxDQUFDLEVBQUUsR0FBRyxJQUFJLENBQUMsRUFBRSxLQUFLLEtBQUssQ0FBQyxFQUFFLEtBQUssSUFBSSxDQUFDLEVBQUUsTUFBTSxLQUFLLENBQUMsRUFBRSxNQUFNLElBQUksQ0FBQyxFQUFFLElBQUksS0FBSyxDQUFDLEVBQUUsSUFBSSxDQUFDO0FBQ3RHLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogQ29weXJpZ2h0IChjKSAyMDE4LTIwMjQgU3dpc3MgRmVkZXJhbCBSYWlsd2F5c1xuICpcbiAqIFRoaXMgcHJvZ3JhbSBhbmQgdGhlIGFjY29tcGFueWluZyBtYXRlcmlhbHMgYXJlIG1hZGVcbiAqIGF2YWlsYWJsZSB1bmRlciB0aGUgdGVybXMgb2YgdGhlIEVjbGlwc2UgUHVibGljIExpY2Vuc2UgMi4wXG4gKiB3aGljaCBpcyBhdmFpbGFibGUgYXQgaHR0cHM6Ly93d3cuZWNsaXBzZS5vcmcvbGVnYWwvZXBsLTIuMC9cbiAqXG4gKiBTUERYLUxpY2Vuc2UtSWRlbnRpZmllcjogRVBMLTIuMFxuICovXG5cbmltcG9ydCB7YXNzZXJ0SW5JbmplY3Rpb25Db250ZXh0LCBhc3NlcnROb3RJblJlYWN0aXZlQ29udGV4dCwgY29tcHV0ZWQsIGVmZmVjdCwgRWxlbWVudFJlZiwgaW5qZWN0LCBJbmplY3RvciwgaXNTaWduYWwsIE5nWm9uZSwgc2lnbmFsLCBTaWduYWwsIHVudHJhY2tlZH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge2NvZXJjZUVsZW1lbnR9IGZyb20gJ0Bhbmd1bGFyL2Nkay9jb2VyY2lvbic7XG5pbXBvcnQge2Zyb21Cb3VuZGluZ0NsaWVudFJlY3QkfSBmcm9tICdAc2Npb24vdG9vbGtpdC9vYnNlcnZhYmxlJztcbmltcG9ydCB7c3Vic2NyaWJlSW5zaWRlfSBmcm9tICdAc2Npb24vdG9vbGtpdC9vcGVyYXRvcnMnO1xuXG4vKipcbiAqIENyZWF0ZXMgYSBzaWduYWwgb2JzZXJ2aW5nIHRoZSBib3VuZGluZyBib3ggb2YgYW4gZWxlbWVudC5cbiAqXG4gKiBUaGUgYm91bmRpbmcgYm94IGluY2x1ZGVzIHRoZSBlbGVtZW50J3MgcG9zaXRpb24gcmVsYXRpdmUgdG8gdGhlIHRvcC1sZWZ0IG9mIHRoZSB2aWV3cG9ydCBhbmQgaXRzIHNpemUuXG4gKiBSZWZlciB0byBodHRwczovL2RldmVsb3Blci5tb3ppbGxhLm9yZy9lbi1VUy9kb2NzL1dlYi9BUEkvRWxlbWVudC9nZXRCb3VuZGluZ0NsaWVudFJlY3QgZm9yIG1vcmUgZGV0YWlscy5cbiAqXG4gKiBUaGUgZWxlbWVudCBjYW4gYmUgcGFzc2VkIGFzIGEgc2lnbmFsLCBlbmFibGluZyBvYnNlcnZhdGlvbiBvZiB2aWV3IGNoaWxkcmVuIGluIHRoZSBjb21wb25lbnQgY29uc3RydWN0b3IuXG4gKlxuICogVGhlcmUgaXMgbm8gbmF0aXZlIGJyb3dzZXIgQVBJIHRvIG9ic2VydmUgdGhlIHBvc2l0aW9uIG9mIGFuIGVsZW1lbnQuIFRoZSBzaWduYWwgdXNlcyB7QGxpbmsgSW50ZXJzZWN0aW9uT2JzZXJ2ZXJ9IGFuZFxuICoge0BsaW5rIFJlc2l6ZU9ic2VydmVyfSB0byBkZXRlY3QgcG9zaXRpb24gY2hhbmdlcy4gRm9yIHRyYWNraW5nIG9ubHkgc2l6ZSBjaGFuZ2VzLCB1c2UgdGhlIHtAbGluayBkaW1lbnNpb259IHNpZ25hbCBpbnN0ZWFkLlxuICpcbiAqIFVzYWdlOlxuICogLSBNdXN0IGJlIGNhbGxlZCB3aXRoaW4gYW4gaW5qZWN0aW9uIGNvbnRleHQgb3IgYW4gaW5qZWN0b3IgcHJvdmlkZWQuIERlc3Ryb3lpbmcgdGhlIGluamVjdG9yIHdpbGwgdW5zdWJzY3JpYmUgdGhlIHNpZ25hbC5cbiAqIC0gTXVzdCBub3QgYmUgY2FsbGVkIHdpdGhpbiBhIHJlYWN0aXZlIGNvbnRleHQgdG8gYXZvaWQgcmVwZWF0ZWQgc3Vic2NyaXB0aW9ucy5cbiAqIC0gVGhlIGVsZW1lbnQgYW5kIHRoZSBkb2N1bWVudCByb290IChgPGh0bWw+YCkgbXVzdCBiZSBwb3NpdGlvbmVkIGByZWxhdGl2ZWAgb3IgYGFic29sdXRlYC4gSWYgbm90LCBhIHdhcm5pbmcgaXMgbG9nZ2VkLCBhbmQgcG9zaXRpb25pbmcgY2hhbmdlZCB0byBgcmVsYXRpdmVgLlxuICovXG5leHBvcnQgZnVuY3Rpb24gYm91bmRpbmdDbGllbnRSZWN0KGVsZW1lbnRMaWtlOiBIVE1MRWxlbWVudCB8IEVsZW1lbnRSZWY8SFRNTEVsZW1lbnQ+IHwgU2lnbmFsPEhUTUxFbGVtZW50IHwgRWxlbWVudFJlZjxIVE1MRWxlbWVudD4+LCBvcHRpb25zPzoge2luamVjdG9yPzogSW5qZWN0b3J9KTogU2lnbmFsPERPTVJlY3Q+O1xuZXhwb3J0IGZ1bmN0aW9uIGJvdW5kaW5nQ2xpZW50UmVjdChlbGVtZW50TGlrZTogSFRNTEVsZW1lbnQgfCBFbGVtZW50UmVmPEhUTUxFbGVtZW50PiB8IFNpZ25hbDxIVE1MRWxlbWVudCB8IEVsZW1lbnRSZWY8SFRNTEVsZW1lbnQ+IHwgdW5kZWZpbmVkPiwgb3B0aW9ucz86IHtpbmplY3Rvcj86IEluamVjdG9yfSk6IFNpZ25hbDxET01SZWN0IHwgdW5kZWZpbmVkPjtcbmV4cG9ydCBmdW5jdGlvbiBib3VuZGluZ0NsaWVudFJlY3QoZWxlbWVudExpa2U6IEhUTUxFbGVtZW50IHwgRWxlbWVudFJlZjxIVE1MRWxlbWVudD4gfCBTaWduYWw8SFRNTEVsZW1lbnQgfCBFbGVtZW50UmVmPEhUTUxFbGVtZW50PiB8IHVuZGVmaW5lZD4sIG9wdGlvbnM/OiB7aW5qZWN0b3I/OiBJbmplY3Rvcn0pOiBTaWduYWw8RE9NUmVjdCB8IHVuZGVmaW5lZD4ge1xuICBhc3NlcnROb3RJblJlYWN0aXZlQ29udGV4dChib3VuZGluZ0NsaWVudFJlY3QsICdJbnZva2luZyBgYm91bmRpbmdDbGllbnRSZWN0YCBjYXVzZXMgbmV3IHN1YnNjcmlwdGlvbnMgZXZlcnkgdGltZS4gTW92ZSBgYm91bmRpbmdDbGllbnRSZWN0YCBvdXRzaWRlIG9mIHRoZSByZWFjdGl2ZSBjb250ZXh0IGFuZCByZWFkIHRoZSBzaWduYWwgdmFsdWUgd2hlcmUgbmVlZGVkLicpO1xuICBpZiAoIW9wdGlvbnM/LmluamVjdG9yKSB7XG4gICAgYXNzZXJ0SW5JbmplY3Rpb25Db250ZXh0KGJvdW5kaW5nQ2xpZW50UmVjdCk7XG4gIH1cblxuICBjb25zdCBpbmplY3RvciA9IG9wdGlvbnM/LmluamVjdG9yID8/IGluamVjdChJbmplY3Rvcik7XG4gIGNvbnN0IHpvbmUgPSBpbmplY3Rvci5nZXQoTmdab25lKTtcbiAgY29uc3QgZWxlbWVudCA9IGNvbXB1dGVkKCgpID0+IGNvZXJjZUVsZW1lbnQoaXNTaWduYWwoZWxlbWVudExpa2UpID8gZWxlbWVudExpa2UoKSA6IGVsZW1lbnRMaWtlKSk7XG4gIGNvbnN0IG9uQm91bmRpbmdCb3hDaGFuZ2UgPSBzaWduYWw8dm9pZD4odW5kZWZpbmVkLCB7ZXF1YWw6ICgpID0+IGZhbHNlfSk7XG5cbiAgLy8gU3Vic2NyaWJlIHRvIGVsZW1lbnQgYm91bmRpbmcgYm94IGNoYW5nZXMuXG4gIGVmZmVjdChvbkNsZWFudXAgPT4ge1xuICAgIGNvbnN0IGVsID0gZWxlbWVudCgpO1xuICAgIGlmICghZWwpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICB1bnRyYWNrZWQoKCkgPT4ge1xuICAgICAgY29uc3Qgc3Vic2NyaXB0aW9uID0gZnJvbUJvdW5kaW5nQ2xpZW50UmVjdCQoZWwpXG4gICAgICAgIC5waXBlKHN1YnNjcmliZUluc2lkZShmbiA9PiB6b25lLnJ1bk91dHNpZGVBbmd1bGFyKGZuKSkpXG4gICAgICAgIC5zdWJzY3JpYmUoKCkgPT4ge1xuICAgICAgICAgIE5nWm9uZS5hc3NlcnROb3RJbkFuZ3VsYXJab25lKCk7XG4gICAgICAgICAgb25Cb3VuZGluZ0JveENoYW5nZS5zZXQoKTtcbiAgICAgICAgfSk7XG4gICAgICBvbkNsZWFudXAoKCkgPT4gc3Vic2NyaXB0aW9uLnVuc3Vic2NyaWJlKCkpO1xuICAgIH0pO1xuICB9LCB7aW5qZWN0b3J9KTtcblxuICAvLyBDcmVhdGUgc2lnbmFsIHRoYXQgcmVjb21wdXRlcyBlYWNoIHRpbWUgdGhlIGJvdW5kaW5nIGJveCBjaGFuZ2VzLlxuICByZXR1cm4gY29tcHV0ZWQoKCkgPT4ge1xuICAgIGNvbnN0IGVsID0gZWxlbWVudCgpO1xuICAgIGlmICghZWwpIHtcbiAgICAgIHJldHVybiB1bmRlZmluZWQ7XG4gICAgfVxuXG4gICAgLy8gVHJhY2sgYm91bmRpbmcgYm94LlxuICAgIG9uQm91bmRpbmdCb3hDaGFuZ2UoKTtcblxuICAgIHJldHVybiBlbC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcbiAgfSwge2VxdWFsOiBpc0VxdWFsRG9tUmVjdH0pO1xufVxuXG5mdW5jdGlvbiBpc0VxdWFsRG9tUmVjdChhOiBET01SZWN0IHwgdW5kZWZpbmVkLCBiOiBET01SZWN0IHwgdW5kZWZpbmVkKTogYm9vbGVhbiB7XG4gIHJldHVybiBhPy50b3AgPT09IGI/LnRvcCAmJiBhPy5yaWdodCA9PT0gYj8ucmlnaHQgJiYgYT8uYm90dG9tID09PSBiPy5ib3R0b20gJiYgYT8ubGVmdCA9PT0gYj8ubGVmdDtcbn1cbiJdfQ==

package/esm2022/dimension/dimension.directive.mjs

@@ -14,9 +14,7 @@ import { observeInside, subscribeInside } from '@scion/toolkit/operators';
 import { animationFrameScheduler, observeOn, subscribeOn } from 'rxjs';
 import * as i0 from "@angular/core";
 /**
- * Observes changes to the size of the host element.
- *
- * Upon subscription, emits the current size, and then continuously when the size changes. The Observable never completes.
+ * Observes the size of the host element.
  *
  * ---
  * Usage:
@@ -28,18 +26,18 @@ import * as i0 from "@angular/core";
 export class SciDimensionDirective {
     constructor() {
         /**
-         * Controls if to emit outside the Angular zone. Defaults to `false`.
+         * Controls if to output outside the Angular zone. Defaults to `false`.
          */
         this.emitOutsideAngular = input(false);
         /**
-         * Upon subscription, emits the current size, and then continuously when the size changes. The Observable never completes.
+         * Outputs the size of the element.
          */
         this.dimensionChange = output({ alias: 'sciDimensionChange' });
         const host = inject((ElementRef)).nativeElement;
         const zone = inject(NgZone);
         fromResize$(host)
-            .pipe(subscribeInside(continueFn => zone.runOutsideAngular(continueFn)), observeInside(continueFn => this.emitOutsideAngular() ? continueFn() : zone.run(continueFn)), subscribeOn(animationFrameScheduler), // to not block resize callback (ResizeObserver loop completed with undelivered notifications)
-        observeOn(animationFrameScheduler), // to not block resize callback (ResizeObserver loop completed with undelivered notifications)
+            .pipe(subscribeInside(continueFn => zone.runOutsideAngular(continueFn)), observeInside(continueFn => this.emitOutsideAngular() ? continueFn() : zone.run(continueFn)), subscribeOn(animationFrameScheduler), // do not block resize callback (ResizeObserver loop completed with undelivered notifications)
+        observeOn(animationFrameScheduler), // do not block resize callback (ResizeObserver loop completed with undelivered notifications)
         takeUntilDestroyed())
             .subscribe(() => {
             this.dimensionChange.emit({
@@ -61,4 +59,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImpor
                     standalone: true,
                 }]
         }], ctorParameters: () => [] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGltZW5zaW9uLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3NjaW9uL2NvbXBvbmVudHMvZGltZW5zaW9uL3NyYy9kaW1lbnNpb24uZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7Ozs7OztHQVFHO0FBRUgsT0FBTyxFQUFDLFNBQVMsRUFBRSxVQUFVLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQ25GLE9BQU8sRUFBQyxXQUFXLEVBQUMsTUFBTSwyQkFBMkIsQ0FBQztBQUN0RCxPQUFPLEVBQUMsa0JBQWtCLEVBQUMsTUFBTSw0QkFBNEIsQ0FBQztBQUM5RCxPQUFPLEVBQUMsYUFBYSxFQUFFLGVBQWUsRUFBQyxNQUFNLDBCQUEwQixDQUFDO0FBQ3hFLE9BQU8sRUFBQyx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsV0FBVyxFQUFDLE1BQU0sTUFBTSxDQUFDOztBQUVyRTs7Ozs7Ozs7Ozs7R0FXRztBQUtILE1BQU0sT0FBTyxxQkFBcUI7SUFZaEM7UUFWQTs7V0FFRztRQUNJLHVCQUFrQixHQUFHLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUV6Qzs7V0FFRztRQUNJLG9CQUFlLEdBQUcsTUFBTSxDQUFlLEVBQUMsS0FBSyxFQUFFLG9CQUFvQixFQUFDLENBQUMsQ0FBQztRQUczRSxNQUFNLElBQUksR0FBRyxNQUFNLENBQUMsQ0FBQSxVQUF1QixDQUFBLENBQUMsQ0FBQyxhQUFhLENBQUM7UUFDM0QsTUFBTSxJQUFJLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBRTVCLFdBQVcsQ0FBQyxJQUFJLENBQUM7YUFDZCxJQUFJLENBQ0gsZUFBZSxDQUFDLFVBQVUsQ0FBQyxFQUFFLENBQUMsSUFBSSxDQUFDLGlCQUFpQixDQUFDLFVBQVUsQ0FBQyxDQUFDLEVBQ2pFLGFBQWEsQ0FBQyxVQUFVLENBQUMsRUFBRSxDQUFDLElBQUksQ0FBQyxrQkFBa0IsRUFBRSxDQUFDLENBQUMsQ0FBQyxVQUFVLEVBQUUsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxVQUFVLENBQUMsQ0FBQyxFQUM1RixXQUFXLENBQUMsdUJBQXVCLENBQUMsRUFBRSw4RkFBOEY7UUFDcEksU0FBUyxDQUFDLHVCQUF1QixDQUFDLEVBQUUsOEZBQThGO1FBQ2xJLGtCQUFrQixFQUFFLENBQ3JCO2FBQ0EsU0FBUyxDQUFDLEdBQUcsRUFBRTtZQUNkLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBSSxDQUFDO2dCQUN4QixXQUFXLEVBQUUsSUFBSSxDQUFDLFdBQVc7Z0JBQzdCLFdBQVcsRUFBRSxJQUFJLENBQUMsV0FBVztnQkFDN0IsWUFBWSxFQUFFLElBQUksQ0FBQyxZQUFZO2dCQUMvQixZQUFZLEVBQUUsSUFBSSxDQUFDLFlBQVk7Z0JBQy9CLE9BQU8sRUFBRSxJQUFJO2FBQ2QsQ0FBQyxDQUFDO1FBQ0wsQ0FBQyxDQUFDLENBQUM7SUFDUCxDQUFDOzhHQWpDVSxxQkFBcUI7a0dBQXJCLHFCQUFxQjs7MkZBQXJCLHFCQUFxQjtrQkFKakMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsZ0JBQWdCO29CQUMxQixVQUFVLEVBQUUsSUFBSTtpQkFDakIiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogQ29weXJpZ2h0IChjKSAyMDE4LTIwMjQgU3dpc3MgRmVkZXJhbCBSYWlsd2F5c1xuICpcbiAqIFRoaXMgcHJvZ3JhbSBhbmQgdGhlIGFjY29tcGFueWluZyBtYXRlcmlhbHMgYXJlIG1hZGVcbiAqIGF2YWlsYWJsZSB1bmRlciB0aGUgdGVybXMgb2YgdGhlIEVjbGlwc2UgUHVibGljIExpY2Vuc2UgMi4wXG4gKiB3aGljaCBpcyBhdmFpbGFibGUgYXQgaHR0cHM6Ly93d3cuZWNsaXBzZS5vcmcvbGVnYWwvZXBsLTIuMC9cbiAqXG4gKiAgU1BEWC1MaWNlbnNlLUlkZW50aWZpZXI6IEVQTC0yLjBcbiAqL1xuXG5pbXBvcnQge0RpcmVjdGl2ZSwgRWxlbWVudFJlZiwgaW5qZWN0LCBpbnB1dCwgTmdab25lLCBvdXRwdXR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtmcm9tUmVzaXplJH0gZnJvbSAnQHNjaW9uL3Rvb2xraXQvb2JzZXJ2YWJsZSc7XG5pbXBvcnQge3Rha2VVbnRpbERlc3Ryb3llZH0gZnJvbSAnQGFuZ3VsYXIvY29yZS9yeGpzLWludGVyb3AnO1xuaW1wb3J0IHtvYnNlcnZlSW5zaWRlLCBzdWJzY3JpYmVJbnNpZGV9IGZyb20gJ0BzY2lvbi90b29sa2l0L29wZXJhdG9ycyc7XG5pbXBvcnQge2FuaW1hdGlvbkZyYW1lU2NoZWR1bGVyLCBvYnNlcnZlT24sIHN1YnNjcmliZU9ufSBmcm9tICdyeGpzJztcblxuLyoqXG4gKiBPYnNlcnZlcyBjaGFuZ2VzIHRvIHRoZSBzaXplIG9mIHRoZSBob3N0IGVsZW1lbnQuXG4gKlxuICogVXBvbiBzdWJzY3JpcHRpb24sIGVtaXRzIHRoZSBjdXJyZW50IHNpemUsIGFuZCB0aGVuIGNvbnRpbnVvdXNseSB3aGVuIHRoZSBzaXplIGNoYW5nZXMuIFRoZSBPYnNlcnZhYmxlIG5ldmVyIGNvbXBsZXRlcy5cbiAqXG4gKiAtLS1cbiAqIFVzYWdlOlxuICpcbiAqIGBgYGh0bWxcbiAqIDxkaXYgc2NpRGltZW5zaW9uIChzY2lEaW1lbnNpb25DaGFuZ2UpPVwib25EaW1lbnNpb25DaGFuZ2UoJGV2ZW50KVwiPjwvZGl2PlxuICogYGBgXG4gKi9cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1tzY2lEaW1lbnNpb25dJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbn0pXG5leHBvcnQgY2xhc3MgU2NpRGltZW5zaW9uRGlyZWN0aXZlIHtcblxuICAvKipcbiAgICogQ29udHJvbHMgaWYgdG8gZW1pdCBvdXRzaWRlIHRoZSBBbmd1bGFyIHpvbmUuIERlZmF1bHRzIHRvIGBmYWxzZWAuXG4gICAqL1xuICBwdWJsaWMgZW1pdE91dHNpZGVBbmd1bGFyID0gaW5wdXQoZmFsc2UpO1xuXG4gIC8qKlxuICAgKiBVcG9uIHN1YnNjcmlwdGlvbiwgZW1pdHMgdGhlIGN1cnJlbnQgc2l6ZSwgYW5kIHRoZW4gY29udGludW91c2x5IHdoZW4gdGhlIHNpemUgY2hhbmdlcy4gVGhlIE9ic2VydmFibGUgbmV2ZXIgY29tcGxldGVzLlxuICAgKi9cbiAgcHVibGljIGRpbWVuc2lvbkNoYW5nZSA9IG91dHB1dDxTY2lEaW1lbnNpb24+KHthbGlhczogJ3NjaURpbWVuc2lvbkNoYW5nZSd9KTtcblxuICBjb25zdHJ1Y3RvcigpIHtcbiAgICBjb25zdCBob3N0ID0gaW5qZWN0KEVsZW1lbnRSZWY8SFRNTEVsZW1lbnQ+KS5uYXRpdmVFbGVtZW50O1xuICAgIGNvbnN0IHpvbmUgPSBpbmplY3QoTmdab25lKTtcblxuICAgIGZyb21SZXNpemUkKGhvc3QpXG4gICAgICAucGlwZShcbiAgICAgICAgc3Vic2NyaWJlSW5zaWRlKGNvbnRpbnVlRm4gPT4gem9uZS5ydW5PdXRzaWRlQW5ndWxhcihjb250aW51ZUZuKSksXG4gICAgICAgIG9ic2VydmVJbnNpZGUoY29udGludWVGbiA9PiB0aGlzLmVtaXRPdXRzaWRlQW5ndWxhcigpID8gY29udGludWVGbigpIDogem9uZS5ydW4oY29udGludWVGbikpLFxuICAgICAgICBzdWJzY3JpYmVPbihhbmltYXRpb25GcmFtZVNjaGVkdWxlciksIC8vIHRvIG5vdCBibG9jayByZXNpemUgY2FsbGJhY2sgKFJlc2l6ZU9ic2VydmVyIGxvb3AgY29tcGxldGVkIHdpdGggdW5kZWxpdmVyZWQgbm90aWZpY2F0aW9ucylcbiAgICAgICAgb2JzZXJ2ZU9uKGFuaW1hdGlvbkZyYW1lU2NoZWR1bGVyKSwgLy8gdG8gbm90IGJsb2NrIHJlc2l6ZSBjYWxsYmFjayAoUmVzaXplT2JzZXJ2ZXIgbG9vcCBjb21wbGV0ZWQgd2l0aCB1bmRlbGl2ZXJlZCBub3RpZmljYXRpb25zKVxuICAgICAgICB0YWtlVW50aWxEZXN0cm95ZWQoKSxcbiAgICAgIClcbiAgICAgIC5zdWJzY3JpYmUoKCkgPT4ge1xuICAgICAgICB0aGlzLmRpbWVuc2lvbkNoYW5nZS5lbWl0KHtcbiAgICAgICAgICBjbGllbnRXaWR0aDogaG9zdC5jbGllbnRXaWR0aCxcbiAgICAgICAgICBvZmZzZXRXaWR0aDogaG9zdC5vZmZzZXRXaWR0aCxcbiAgICAgICAgICBjbGllbnRIZWlnaHQ6IGhvc3QuY2xpZW50SGVpZ2h0LFxuICAgICAgICAgIG9mZnNldEhlaWdodDogaG9zdC5vZmZzZXRIZWlnaHQsXG4gICAgICAgICAgZWxlbWVudDogaG9zdCxcbiAgICAgICAgfSk7XG4gICAgICB9KTtcbiAgfVxufVxuXG4vKipcbiAqIFJlcHJlc2VudHMgdGhlIGRpbWVuc2lvbiBvZiBhbiBlbGVtZW50LlxuICovXG5leHBvcnQgaW50ZXJmYWNlIFNjaURpbWVuc2lvbiB7XG4gIG9mZnNldFdpZHRoOiBudW1iZXI7XG4gIG9mZnNldEhlaWdodDogbnVtYmVyO1xuICBjbGllbnRXaWR0aDogbnVtYmVyO1xuICBjbGllbnRIZWlnaHQ6IG51bWJlcjtcbiAgZWxlbWVudDogSFRNTEVsZW1lbnQ7XG59XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGltZW5zaW9uLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3NjaW9uL2NvbXBvbmVudHMvZGltZW5zaW9uL3NyYy9kaW1lbnNpb24uZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7Ozs7OztHQVFHO0FBRUgsT0FBTyxFQUFDLFNBQVMsRUFBRSxVQUFVLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQ25GLE9BQU8sRUFBQyxXQUFXLEVBQUMsTUFBTSwyQkFBMkIsQ0FBQztBQUN0RCxPQUFPLEVBQUMsa0JBQWtCLEVBQUMsTUFBTSw0QkFBNEIsQ0FBQztBQUM5RCxPQUFPLEVBQUMsYUFBYSxFQUFFLGVBQWUsRUFBQyxNQUFNLDBCQUEwQixDQUFDO0FBQ3hFLE9BQU8sRUFBQyx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsV0FBVyxFQUFDLE1BQU0sTUFBTSxDQUFDOztBQUdyRTs7Ozs7Ozs7O0dBU0c7QUFLSCxNQUFNLE9BQU8scUJBQXFCO0lBWWhDO1FBVkE7O1dBRUc7UUFDSSx1QkFBa0IsR0FBRyxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUM7UUFFekM7O1dBRUc7UUFDSSxvQkFBZSxHQUFHLE1BQU0sQ0FBZSxFQUFDLEtBQUssRUFBRSxvQkFBb0IsRUFBQyxDQUFDLENBQUM7UUFHM0UsTUFBTSxJQUFJLEdBQUcsTUFBTSxDQUFDLENBQUEsVUFBdUIsQ0FBQSxDQUFDLENBQUMsYUFBYSxDQUFDO1FBQzNELE1BQU0sSUFBSSxHQUFHLE1BQU0sQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUU1QixXQUFXLENBQUMsSUFBSSxDQUFDO2FBQ2QsSUFBSSxDQUNILGVBQWUsQ0FBQyxVQUFVLENBQUMsRUFBRSxDQUFDLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxVQUFVLENBQUMsQ0FBQyxFQUNqRSxhQUFhLENBQUMsVUFBVSxDQUFDLEVBQUUsQ0FBQyxJQUFJLENBQUMsa0JBQWtCLEVBQUUsQ0FBQyxDQUFDLENBQUMsVUFBVSxFQUFFLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsVUFBVSxDQUFDLENBQUMsRUFDNUYsV0FBVyxDQUFDLHVCQUF1QixDQUFDLEVBQUUsOEZBQThGO1FBQ3BJLFNBQVMsQ0FBQyx1QkFBdUIsQ0FBQyxFQUFFLDhGQUE4RjtRQUNsSSxrQkFBa0IsRUFBRSxDQUNyQjthQUNBLFNBQVMsQ0FBQyxHQUFHLEVBQUU7WUFDZCxJQUFJLENBQUMsZUFBZSxDQUFDLElBQUksQ0FBQztnQkFDeEIsV0FBVyxFQUFFLElBQUksQ0FBQyxXQUFXO2dCQUM3QixXQUFXLEVBQUUsSUFBSSxDQUFDLFdBQVc7Z0JBQzdCLFlBQVksRUFBRSxJQUFJLENBQUMsWUFBWTtnQkFDL0IsWUFBWSxFQUFFLElBQUksQ0FBQyxZQUFZO2dCQUMvQixPQUFPLEVBQUUsSUFBSTthQUNkLENBQUMsQ0FBQztRQUNMLENBQUMsQ0FBQyxDQUFDO0lBQ1AsQ0FBQzs4R0FqQ1UscUJBQXFCO2tHQUFyQixxQkFBcUI7OzJGQUFyQixxQkFBcUI7a0JBSmpDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLGdCQUFnQjtvQkFDMUIsVUFBVSxFQUFFLElBQUk7aUJBQ2pCIiwic291cmNlc0NvbnRlbnQiOlsiLypcbiAqIENvcHlyaWdodCAoYykgMjAxOC0yMDI0IFN3aXNzIEZlZGVyYWwgUmFpbHdheXNcbiAqXG4gKiBUaGlzIHByb2dyYW0gYW5kIHRoZSBhY2NvbXBhbnlpbmcgbWF0ZXJpYWxzIGFyZSBtYWRlXG4gKiBhdmFpbGFibGUgdW5kZXIgdGhlIHRlcm1zIG9mIHRoZSBFY2xpcHNlIFB1YmxpYyBMaWNlbnNlIDIuMFxuICogd2hpY2ggaXMgYXZhaWxhYmxlIGF0IGh0dHBzOi8vd3d3LmVjbGlwc2Uub3JnL2xlZ2FsL2VwbC0yLjAvXG4gKlxuICogIFNQRFgtTGljZW5zZS1JZGVudGlmaWVyOiBFUEwtMi4wXG4gKi9cblxuaW1wb3J0IHtEaXJlY3RpdmUsIEVsZW1lbnRSZWYsIGluamVjdCwgaW5wdXQsIE5nWm9uZSwgb3V0cHV0fSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7ZnJvbVJlc2l6ZSR9IGZyb20gJ0BzY2lvbi90b29sa2l0L29ic2VydmFibGUnO1xuaW1wb3J0IHt0YWtlVW50aWxEZXN0cm95ZWR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUvcnhqcy1pbnRlcm9wJztcbmltcG9ydCB7b2JzZXJ2ZUluc2lkZSwgc3Vic2NyaWJlSW5zaWRlfSBmcm9tICdAc2Npb24vdG9vbGtpdC9vcGVyYXRvcnMnO1xuaW1wb3J0IHthbmltYXRpb25GcmFtZVNjaGVkdWxlciwgb2JzZXJ2ZU9uLCBzdWJzY3JpYmVPbn0gZnJvbSAncnhqcyc7XG5pbXBvcnQge1NjaURpbWVuc2lvbn0gZnJvbSAnLi9kaW1lbnNpb24nO1xuXG4vKipcbiAqIE9ic2VydmVzIHRoZSBzaXplIG9mIHRoZSBob3N0IGVsZW1lbnQuXG4gKlxuICogLS0tXG4gKiBVc2FnZTpcbiAqXG4gKiBgYGBodG1sXG4gKiA8ZGl2IHNjaURpbWVuc2lvbiAoc2NpRGltZW5zaW9uQ2hhbmdlKT1cIm9uRGltZW5zaW9uQ2hhbmdlKCRldmVudClcIj48L2Rpdj5cbiAqIGBgYFxuICovXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbc2NpRGltZW5zaW9uXScsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG59KVxuZXhwb3J0IGNsYXNzIFNjaURpbWVuc2lvbkRpcmVjdGl2ZSB7XG5cbiAgLyoqXG4gICAqIENvbnRyb2xzIGlmIHRvIG91dHB1dCBvdXRzaWRlIHRoZSBBbmd1bGFyIHpvbmUuIERlZmF1bHRzIHRvIGBmYWxzZWAuXG4gICAqL1xuICBwdWJsaWMgZW1pdE91dHNpZGVBbmd1bGFyID0gaW5wdXQoZmFsc2UpO1xuXG4gIC8qKlxuICAgKiBPdXRwdXRzIHRoZSBzaXplIG9mIHRoZSBlbGVtZW50LlxuICAgKi9cbiAgcHVibGljIGRpbWVuc2lvbkNoYW5nZSA9IG91dHB1dDxTY2lEaW1lbnNpb24+KHthbGlhczogJ3NjaURpbWVuc2lvbkNoYW5nZSd9KTtcblxuICBjb25zdHJ1Y3RvcigpIHtcbiAgICBjb25zdCBob3N0ID0gaW5qZWN0KEVsZW1lbnRSZWY8SFRNTEVsZW1lbnQ+KS5uYXRpdmVFbGVtZW50O1xuICAgIGNvbnN0IHpvbmUgPSBpbmplY3QoTmdab25lKTtcblxuICAgIGZyb21SZXNpemUkKGhvc3QpXG4gICAgICAucGlwZShcbiAgICAgICAgc3Vic2NyaWJlSW5zaWRlKGNvbnRpbnVlRm4gPT4gem9uZS5ydW5PdXRzaWRlQW5ndWxhcihjb250aW51ZUZuKSksXG4gICAgICAgIG9ic2VydmVJbnNpZGUoY29udGludWVGbiA9PiB0aGlzLmVtaXRPdXRzaWRlQW5ndWxhcigpID8gY29udGludWVGbigpIDogem9uZS5ydW4oY29udGludWVGbikpLFxuICAgICAgICBzdWJzY3JpYmVPbihhbmltYXRpb25GcmFtZVNjaGVkdWxlciksIC8vIGRvIG5vdCBibG9jayByZXNpemUgY2FsbGJhY2sgKFJlc2l6ZU9ic2VydmVyIGxvb3AgY29tcGxldGVkIHdpdGggdW5kZWxpdmVyZWQgbm90aWZpY2F0aW9ucylcbiAgICAgICAgb2JzZXJ2ZU9uKGFuaW1hdGlvbkZyYW1lU2NoZWR1bGVyKSwgLy8gZG8gbm90IGJsb2NrIHJlc2l6ZSBjYWxsYmFjayAoUmVzaXplT2JzZXJ2ZXIgbG9vcCBjb21wbGV0ZWQgd2l0aCB1bmRlbGl2ZXJlZCBub3RpZmljYXRpb25zKVxuICAgICAgICB0YWtlVW50aWxEZXN0cm95ZWQoKSxcbiAgICAgIClcbiAgICAgIC5zdWJzY3JpYmUoKCkgPT4ge1xuICAgICAgICB0aGlzLmRpbWVuc2lvbkNoYW5nZS5lbWl0KHtcbiAgICAgICAgICBjbGllbnRXaWR0aDogaG9zdC5jbGllbnRXaWR0aCxcbiAgICAgICAgICBvZmZzZXRXaWR0aDogaG9zdC5vZmZzZXRXaWR0aCxcbiAgICAgICAgICBjbGllbnRIZWlnaHQ6IGhvc3QuY2xpZW50SGVpZ2h0LFxuICAgICAgICAgIG9mZnNldEhlaWdodDogaG9zdC5vZmZzZXRIZWlnaHQsXG4gICAgICAgICAgZWxlbWVudDogaG9zdCxcbiAgICAgICAgfSk7XG4gICAgICB9KTtcbiAgfVxufVxuIl19

package/esm2022/dimension/dimension.mjs

@@ -0,0 +1,11 @@
+/*
+ * Copyright (c) 2018-2024 Swiss Federal Railways
+ *
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ *  SPDX-License-Identifier: EPL-2.0
+ */
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGltZW5zaW9uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc2Npb24vY29tcG9uZW50cy9kaW1lbnNpb24vc3JjL2RpbWVuc2lvbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7R0FRRyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTgtMjAyNCBTd2lzcyBGZWRlcmFsIFJhaWx3YXlzXG4gKlxuICogVGhpcyBwcm9ncmFtIGFuZCB0aGUgYWNjb21wYW55aW5nIG1hdGVyaWFscyBhcmUgbWFkZVxuICogYXZhaWxhYmxlIHVuZGVyIHRoZSB0ZXJtcyBvZiB0aGUgRWNsaXBzZSBQdWJsaWMgTGljZW5zZSAyLjBcbiAqIHdoaWNoIGlzIGF2YWlsYWJsZSBhdCBodHRwczovL3d3dy5lY2xpcHNlLm9yZy9sZWdhbC9lcGwtMi4wL1xuICpcbiAqICBTUERYLUxpY2Vuc2UtSWRlbnRpZmllcjogRVBMLTIuMFxuICovXG5cbi8qKlxuICogUmVwcmVzZW50cyB0aGUgZGltZW5zaW9uIG9mIGFuIGVsZW1lbnQuXG4gKi9cbmV4cG9ydCBpbnRlcmZhY2UgU2NpRGltZW5zaW9uIHtcbiAgb2Zmc2V0V2lkdGg6IG51bWJlcjtcbiAgb2Zmc2V0SGVpZ2h0OiBudW1iZXI7XG4gIGNsaWVudFdpZHRoOiBudW1iZXI7XG4gIGNsaWVudEhlaWdodDogbnVtYmVyO1xuICBlbGVtZW50OiBIVE1MRWxlbWVudDtcbn1cbiJdfQ==

package/esm2022/dimension/dimension.signal.mjs

@@ -0,0 +1,58 @@
+/*
+ * Copyright (c) 2018-2024 Swiss Federal Railways
+ *
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ */
+import { assertInInjectionContext, assertNotInReactiveContext, computed, effect, inject, Injector, isSignal, NgZone, signal, untracked } from '@angular/core';
+import { coerceElement } from '@angular/cdk/coercion';
+import { Objects } from '@scion/toolkit/util';
+import { fromResize$ } from '@scion/toolkit/observable';
+import { animationFrameScheduler, observeOn } from 'rxjs';
+import { subscribeInside } from '@scion/toolkit/operators';
+export function dimension(elementLike, options) {
+    assertNotInReactiveContext(dimension, 'Invoking `dimension` causes new subscriptions every time. Move `dimension` outside of the reactive context and read the signal value where needed.');
+    if (!options?.injector) {
+        assertInInjectionContext(dimension);
+    }
+    const injector = options?.injector ?? inject(Injector);
+    const zone = injector.get(NgZone);
+    const element = computed(() => coerceElement(isSignal(elementLike) ? elementLike() : elementLike));
+    const onResize = signal(undefined, { equal: () => false });
+    // Subscribe to element size changes.
+    effect(onCleanup => {
+        const el = element();
+        if (!el) {
+            return;
+        }
+        untracked(() => {
+            const subscription = fromResize$(el)
+                .pipe(subscribeInside(fn => zone.runOutsideAngular(fn)), observeOn(animationFrameScheduler))
+                .subscribe(() => {
+                NgZone.assertNotInAngularZone();
+                onResize.set();
+            });
+            onCleanup(() => subscription.unsubscribe());
+        });
+    }, { injector });
+    // Create signal that recomputes each time the size changes.
+    return computed(() => {
+        const el = element();
+        if (!el) {
+            return undefined;
+        }
+        // Track element size.
+        onResize();
+        return {
+            clientWidth: el.clientWidth,
+            offsetWidth: el.offsetWidth,
+            clientHeight: el.clientHeight,
+            offsetHeight: el.offsetHeight,
+            element: el,
+        };
+    }, { equal: Objects.isEqual });
+}
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGltZW5zaW9uLnNpZ25hbC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3NjaW9uL2NvbXBvbmVudHMvZGltZW5zaW9uL3NyYy9kaW1lbnNpb24uc2lnbmFsLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7Ozs7OztHQVFHO0FBRUgsT0FBTyxFQUFDLHdCQUF3QixFQUFFLDBCQUEwQixFQUFFLFFBQVEsRUFBRSxNQUFNLEVBQWMsTUFBTSxFQUFFLFFBQVEsRUFBRSxRQUFRLEVBQUUsTUFBTSxFQUFFLE1BQU0sRUFBVSxTQUFTLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFFaEwsT0FBTyxFQUFDLGFBQWEsRUFBQyxNQUFNLHVCQUF1QixDQUFDO0FBQ3BELE9BQU8sRUFBQyxPQUFPLEVBQUMsTUFBTSxxQkFBcUIsQ0FBQztBQUM1QyxPQUFPLEVBQUMsV0FBVyxFQUFDLE1BQU0sMkJBQTJCLENBQUM7QUFDdEQsT0FBTyxFQUFDLHVCQUF1QixFQUFFLFNBQVMsRUFBQyxNQUFNLE1BQU0sQ0FBQztBQUN4RCxPQUFPLEVBQUMsZUFBZSxFQUFDLE1BQU0sMEJBQTBCLENBQUM7QUFlekQsTUFBTSxVQUFVLFNBQVMsQ0FBQyxXQUE4RyxFQUFFLE9BQStCO0lBQ3ZLLDBCQUEwQixDQUFDLFNBQVMsRUFBRSxvSkFBb0osQ0FBQyxDQUFDO0lBQzVMLElBQUksQ0FBQyxPQUFPLEVBQUUsUUFBUSxFQUFFLENBQUM7UUFDdkIsd0JBQXdCLENBQUMsU0FBUyxDQUFDLENBQUM7SUFDdEMsQ0FBQztJQUVELE1BQU0sUUFBUSxHQUFHLE9BQU8sRUFBRSxRQUFRLElBQUksTUFBTSxDQUFDLFFBQVEsQ0FBQyxDQUFDO0lBQ3ZELE1BQU0sSUFBSSxHQUFHLFFBQVEsQ0FBQyxHQUFHLENBQUMsTUFBTSxDQUFDLENBQUM7SUFDbEMsTUFBTSxPQUFPLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLGFBQWEsQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLENBQUMsQ0FBQyxDQUFDLFdBQVcsRUFBRSxDQUFDLENBQUMsQ0FBQyxXQUFXLENBQUMsQ0FBQyxDQUFDO0lBQ25HLE1BQU0sUUFBUSxHQUFHLE1BQU0sQ0FBTyxTQUFTLEVBQUUsRUFBQyxLQUFLLEVBQUUsR0FBRyxFQUFFLENBQUMsS0FBSyxFQUFDLENBQUMsQ0FBQztJQUUvRCxxQ0FBcUM7SUFDckMsTUFBTSxDQUFDLFNBQVMsQ0FBQyxFQUFFO1FBQ2pCLE1BQU0sRUFBRSxHQUFHLE9BQU8sRUFBRSxDQUFDO1FBQ3JCLElBQUksQ0FBQyxFQUFFLEVBQUUsQ0FBQztZQUNSLE9BQU87UUFDVCxDQUFDO1FBRUQsU0FBUyxDQUFDLEdBQUcsRUFBRTtZQUNiLE1BQU0sWUFBWSxHQUFHLFdBQVcsQ0FBQyxFQUFFLENBQUM7aUJBQ2pDLElBQUksQ0FDSCxlQUFlLENBQUMsRUFBRSxDQUFDLEVBQUUsQ0FBQyxJQUFJLENBQUMsaUJBQWlCLENBQUMsRUFBRSxDQUFDLENBQUMsRUFDakQsU0FBUyxDQUFDLHVCQUF1QixDQUFDLENBQ25DO2lCQUNBLFNBQVMsQ0FBQyxHQUFHLEVBQUU7Z0JBQ2QsTUFBTSxDQUFDLHNCQUFzQixFQUFFLENBQUM7Z0JBQ2hDLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FBQztZQUNqQixDQUFDLENBQUMsQ0FBQztZQUNMLFNBQVMsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxZQUFZLENBQUMsV0FBVyxFQUFFLENBQUMsQ0FBQztRQUM5QyxDQUFDLENBQUMsQ0FBQztJQUNMLENBQUMsRUFBRSxFQUFDLFFBQVEsRUFBQyxDQUFDLENBQUM7SUFFZiw0REFBNEQ7SUFDNUQsT0FBTyxRQUFRLENBQUMsR0FBRyxFQUFFO1FBQ25CLE1BQU0sRUFBRSxHQUFHLE9BQU8sRUFBRSxDQUFDO1FBQ3JCLElBQUksQ0FBQyxFQUFFLEVBQUUsQ0FBQztZQUNSLE9BQU8sU0FBUyxDQUFDO1FBQ25CLENBQUM7UUFFRCxzQkFBc0I7UUFDdEIsUUFBUSxFQUFFLENBQUM7UUFFWCxPQUFPO1lBQ0wsV0FBVyxFQUFFLEVBQUUsQ0FBQyxXQUFXO1lBQzNCLFdBQVcsRUFBRSxFQUFFLENBQUMsV0FBVztZQUMzQixZQUFZLEVBQUUsRUFBRSxDQUFDLFlBQVk7WUFDN0IsWUFBWSxFQUFFLEVBQUUsQ0FBQyxZQUFZO1lBQzdCLE9BQU8sRUFBRSxFQUFFO1NBQ1osQ0FBQztJQUNKLENBQUMsRUFBRSxFQUFDLEtBQUssRUFBRSxPQUFPLENBQUMsT0FBTyxFQUFDLENBQUMsQ0FBQztBQUMvQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLypcbiAqIENvcHlyaWdodCAoYykgMjAxOC0yMDI0IFN3aXNzIEZlZGVyYWwgUmFpbHdheXNcbiAqXG4gKiBUaGlzIHByb2dyYW0gYW5kIHRoZSBhY2NvbXBhbnlpbmcgbWF0ZXJpYWxzIGFyZSBtYWRlXG4gKiBhdmFpbGFibGUgdW5kZXIgdGhlIHRlcm1zIG9mIHRoZSBFY2xpcHNlIFB1YmxpYyBMaWNlbnNlIDIuMFxuICogd2hpY2ggaXMgYXZhaWxhYmxlIGF0IGh0dHBzOi8vd3d3LmVjbGlwc2Uub3JnL2xlZ2FsL2VwbC0yLjAvXG4gKlxuICogU1BEWC1MaWNlbnNlLUlkZW50aWZpZXI6IEVQTC0yLjBcbiAqL1xuXG5pbXBvcnQge2Fzc2VydEluSW5qZWN0aW9uQ29udGV4dCwgYXNzZXJ0Tm90SW5SZWFjdGl2ZUNvbnRleHQsIGNvbXB1dGVkLCBlZmZlY3QsIEVsZW1lbnRSZWYsIGluamVjdCwgSW5qZWN0b3IsIGlzU2lnbmFsLCBOZ1pvbmUsIHNpZ25hbCwgU2lnbmFsLCB1bnRyYWNrZWR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtTY2lEaW1lbnNpb259IGZyb20gJy4vZGltZW5zaW9uJztcbmltcG9ydCB7Y29lcmNlRWxlbWVudH0gZnJvbSAnQGFuZ3VsYXIvY2RrL2NvZXJjaW9uJztcbmltcG9ydCB7T2JqZWN0c30gZnJvbSAnQHNjaW9uL3Rvb2xraXQvdXRpbCc7XG5pbXBvcnQge2Zyb21SZXNpemUkfSBmcm9tICdAc2Npb24vdG9vbGtpdC9vYnNlcnZhYmxlJztcbmltcG9ydCB7YW5pbWF0aW9uRnJhbWVTY2hlZHVsZXIsIG9ic2VydmVPbn0gZnJvbSAncnhqcyc7XG5pbXBvcnQge3N1YnNjcmliZUluc2lkZX0gZnJvbSAnQHNjaW9uL3Rvb2xraXQvb3BlcmF0b3JzJztcblxuLyoqXG4gKiBDcmVhdGVzIGEgc2lnbmFsIG9ic2VydmluZyB0aGUgc2l6ZSBvZiBhbiBlbGVtZW50LlxuICpcbiAqIFRoZSBlbGVtZW50IGNhbiBiZSBwYXNzZWQgYXMgYSBzaWduYWwsIGVuYWJsaW5nIG9ic2VydmF0aW9uIG9mIHZpZXcgY2hpbGRyZW4gaW4gdGhlIGNvbXBvbmVudCBjb25zdHJ1Y3Rvci5cbiAqXG4gKiBUaGUgc2lnbmFsIHN1YnNjcmliZXMgdG8gdGhlIG5hdGl2ZSB7QGxpbmsgUmVzaXplT2JzZXJ2ZXJ9IHRvIG1vbml0b3IgZWxlbWVudCBzaXplIGNoYW5nZXMuIERlc3Ryb3lpbmcgdGhlIGluamVjdGlvbiBjb250ZXh0IHdpbGwgdW5zdWJzY3JpYmUgdGhlIG9ic2VydmVyLlxuICpcbiAqIFVzYWdlOlxuICogLSBNdXN0IGJlIGNhbGxlZCB3aXRoaW4gYW4gaW5qZWN0aW9uIGNvbnRleHQgb3IgYW4gaW5qZWN0b3IgcHJvdmlkZWQuIERlc3Ryb3lpbmcgdGhlIGluamVjdG9yIHdpbGwgdW5zdWJzY3JpYmUgdGhlIHNpZ25hbC5cbiAqIC0gTXVzdCBub3QgYmUgY2FsbGVkIHdpdGhpbiBhIHJlYWN0aXZlIGNvbnRleHQgdG8gYXZvaWQgcmVwZWF0ZWQgc3Vic2NyaXB0aW9ucy5cbiAqL1xuZXhwb3J0IGZ1bmN0aW9uIGRpbWVuc2lvbihlbGVtZW50TGlrZTogSFRNTEVsZW1lbnQgfCBFbGVtZW50UmVmPEhUTUxFbGVtZW50PiB8IFNpZ25hbDxIVE1MRWxlbWVudCB8IEVsZW1lbnRSZWY8SFRNTEVsZW1lbnQ+Piwgb3B0aW9ucz86IHtpbmplY3Rvcj86IEluamVjdG9yfSk6IFNpZ25hbDxTY2lEaW1lbnNpb24+O1xuZXhwb3J0IGZ1bmN0aW9uIGRpbWVuc2lvbihlbGVtZW50TGlrZTogSFRNTEVsZW1lbnQgfCBFbGVtZW50UmVmPEhUTUxFbGVtZW50PiB8IFNpZ25hbDxIVE1MRWxlbWVudCB8IEVsZW1lbnRSZWY8SFRNTEVsZW1lbnQ+IHwgdW5kZWZpbmVkPiwgb3B0aW9ucz86IHtpbmplY3Rvcj86IEluamVjdG9yfSk6IFNpZ25hbDxTY2lEaW1lbnNpb24gfCB1bmRlZmluZWQ+O1xuZXhwb3J0IGZ1bmN0aW9uIGRpbWVuc2lvbihlbGVtZW50TGlrZTogSFRNTEVsZW1lbnQgfCBFbGVtZW50UmVmPEhUTUxFbGVtZW50PiB8IFNpZ25hbDxIVE1MRWxlbWVudCB8IEVsZW1lbnRSZWY8SFRNTEVsZW1lbnQ+IHwgdW5kZWZpbmVkPiwgb3B0aW9ucz86IHtpbmplY3Rvcj86IEluamVjdG9yfSk6IFNpZ25hbDxTY2lEaW1lbnNpb24gfCB1bmRlZmluZWQ+IHtcbiAgYXNzZXJ0Tm90SW5SZWFjdGl2ZUNvbnRleHQoZGltZW5zaW9uLCAnSW52b2tpbmcgYGRpbWVuc2lvbmAgY2F1c2VzIG5ldyBzdWJzY3JpcHRpb25zIGV2ZXJ5IHRpbWUuIE1vdmUgYGRpbWVuc2lvbmAgb3V0c2lkZSBvZiB0aGUgcmVhY3RpdmUgY29udGV4dCBhbmQgcmVhZCB0aGUgc2lnbmFsIHZhbHVlIHdoZXJlIG5lZWRlZC4nKTtcbiAgaWYgKCFvcHRpb25zPy5pbmplY3Rvcikge1xuICAgIGFzc2VydEluSW5qZWN0aW9uQ29udGV4dChkaW1lbnNpb24pO1xuICB9XG5cbiAgY29uc3QgaW5qZWN0b3IgPSBvcHRpb25zPy5pbmplY3RvciA/PyBpbmplY3QoSW5qZWN0b3IpO1xuICBjb25zdCB6b25lID0gaW5qZWN0b3IuZ2V0KE5nWm9uZSk7XG4gIGNvbnN0IGVsZW1lbnQgPSBjb21wdXRlZCgoKSA9PiBjb2VyY2VFbGVtZW50KGlzU2lnbmFsKGVsZW1lbnRMaWtlKSA/IGVsZW1lbnRMaWtlKCkgOiBlbGVtZW50TGlrZSkpO1xuICBjb25zdCBvblJlc2l6ZSA9IHNpZ25hbDx2b2lkPih1bmRlZmluZWQsIHtlcXVhbDogKCkgPT4gZmFsc2V9KTtcblxuICAvLyBTdWJzY3JpYmUgdG8gZWxlbWVudCBzaXplIGNoYW5nZXMuXG4gIGVmZmVjdChvbkNsZWFudXAgPT4ge1xuICAgIGNvbnN0IGVsID0gZWxlbWVudCgpO1xuICAgIGlmICghZWwpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICB1bnRyYWNrZWQoKCkgPT4ge1xuICAgICAgY29uc3Qgc3Vic2NyaXB0aW9uID0gZnJvbVJlc2l6ZSQoZWwpXG4gICAgICAgIC5waXBlKFxuICAgICAgICAgIHN1YnNjcmliZUluc2lkZShmbiA9PiB6b25lLnJ1bk91dHNpZGVBbmd1bGFyKGZuKSksXG4gICAgICAgICAgb2JzZXJ2ZU9uKGFuaW1hdGlvbkZyYW1lU2NoZWR1bGVyKSwgLy8gZG8gbm90IGJsb2NrIHJlc2l6ZSBjYWxsYmFjayAoUmVzaXplT2JzZXJ2ZXIgbG9vcCBjb21wbGV0ZWQgd2l0aCB1bmRlbGl2ZXJlZCBub3RpZmljYXRpb25zKVxuICAgICAgICApXG4gICAgICAgIC5zdWJzY3JpYmUoKCkgPT4ge1xuICAgICAgICAgIE5nWm9uZS5hc3NlcnROb3RJbkFuZ3VsYXJab25lKCk7XG4gICAgICAgICAgb25SZXNpemUuc2V0KCk7XG4gICAgICAgIH0pO1xuICAgICAgb25DbGVhbnVwKCgpID0+IHN1YnNjcmlwdGlvbi51bnN1YnNjcmliZSgpKTtcbiAgICB9KTtcbiAgfSwge2luamVjdG9yfSk7XG5cbiAgLy8gQ3JlYXRlIHNpZ25hbCB0aGF0IHJlY29tcHV0ZXMgZWFjaCB0aW1lIHRoZSBzaXplIGNoYW5nZXMuXG4gIHJldHVybiBjb21wdXRlZCgoKSA9PiB7XG4gICAgY29uc3QgZWwgPSBlbGVtZW50KCk7XG4gICAgaWYgKCFlbCkge1xuICAgICAgcmV0dXJuIHVuZGVmaW5lZDtcbiAgICB9XG5cbiAgICAvLyBUcmFjayBlbGVtZW50IHNpemUuXG4gICAgb25SZXNpemUoKTtcblxuICAgIHJldHVybiB7XG4gICAgICBjbGllbnRXaWR0aDogZWwuY2xpZW50V2lkdGgsXG4gICAgICBvZmZzZXRXaWR0aDogZWwub2Zmc2V0V2lkdGgsXG4gICAgICBjbGllbnRIZWlnaHQ6IGVsLmNsaWVudEhlaWdodCxcbiAgICAgIG9mZnNldEhlaWdodDogZWwub2Zmc2V0SGVpZ2h0LFxuICAgICAgZWxlbWVudDogZWwsXG4gICAgfTtcbiAgfSwge2VxdWFsOiBPYmplY3RzLmlzRXF1YWx9KTtcbn1cbiJdfQ==

package/esm2022/dimension/public_api.mjs

@@ -14,4 +14,6 @@
  */
 export { SciDimensionModule } from './dimension.module';
 export { SciDimensionDirective } from './dimension.directive';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljX2FwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3NjaW9uL2NvbXBvbmVudHMvZGltZW5zaW9uL3NyYy9wdWJsaWNfYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7Ozs7OztHQVFHO0FBRUg7Ozs7R0FJRztBQUNILE9BQU8sRUFBQyxrQkFBa0IsRUFBQyxNQUFNLG9CQUFvQixDQUFDO0FBQ3RELE9BQU8sRUFBQyxxQkFBcUIsRUFBZSxNQUFNLHVCQUF1QixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLypcbiAqIENvcHlyaWdodCAoYykgMjAxOC0yMDE5IFN3aXNzIEZlZGVyYWwgUmFpbHdheXNcbiAqXG4gKiBUaGlzIHByb2dyYW0gYW5kIHRoZSBhY2NvbXBhbnlpbmcgbWF0ZXJpYWxzIGFyZSBtYWRlXG4gKiBhdmFpbGFibGUgdW5kZXIgdGhlIHRlcm1zIG9mIHRoZSBFY2xpcHNlIFB1YmxpYyBMaWNlbnNlIDIuMFxuICogd2hpY2ggaXMgYXZhaWxhYmxlIGF0IGh0dHBzOi8vd3d3LmVjbGlwc2Uub3JnL2xlZ2FsL2VwbC0yLjAvXG4gKlxuICogIFNQRFgtTGljZW5zZS1JZGVudGlmaWVyOiBFUEwtMi4wXG4gKi9cblxuLypcbiAqIFNlY29uZGFyeSBlbnRyeXBvaW50OiAnQHNjaW9uL2NvbXBvbmVudHMvZGltZW5zaW9uJ1xuICpcbiAqIEBzZWUgaHR0cHM6Ly9naXRodWIuY29tL25nLXBhY2thZ3IvbmctcGFja2Fnci9ibG9iL21hc3Rlci9kb2NzL3NlY29uZGFyeS1lbnRyeXBvaW50cy5tZFxuICovXG5leHBvcnQge1NjaURpbWVuc2lvbk1vZHVsZX0gZnJvbSAnLi9kaW1lbnNpb24ubW9kdWxlJztcbmV4cG9ydCB7U2NpRGltZW5zaW9uRGlyZWN0aXZlLCBTY2lEaW1lbnNpb259IGZyb20gJy4vZGltZW5zaW9uLmRpcmVjdGl2ZSc7XG4iXX0=
+export { dimension } from './dimension.signal';
+export { boundingClientRect } from './bounding-client-rect.signal';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljX2FwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3NjaW9uL2NvbXBvbmVudHMvZGltZW5zaW9uL3NyYy9wdWJsaWNfYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7Ozs7OztHQVFHO0FBRUg7Ozs7R0FJRztBQUNILE9BQU8sRUFBQyxrQkFBa0IsRUFBQyxNQUFNLG9CQUFvQixDQUFDO0FBQ3RELE9BQU8sRUFBQyxxQkFBcUIsRUFBQyxNQUFNLHVCQUF1QixDQUFDO0FBQzVELE9BQU8sRUFBQyxTQUFTLEVBQUMsTUFBTSxvQkFBb0IsQ0FBQztBQUM3QyxPQUFPLEVBQUMsa0JBQWtCLEVBQUMsTUFBTSwrQkFBK0IsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTgtMjAxOSBTd2lzcyBGZWRlcmFsIFJhaWx3YXlzXG4gKlxuICogVGhpcyBwcm9ncmFtIGFuZCB0aGUgYWNjb21wYW55aW5nIG1hdGVyaWFscyBhcmUgbWFkZVxuICogYXZhaWxhYmxlIHVuZGVyIHRoZSB0ZXJtcyBvZiB0aGUgRWNsaXBzZSBQdWJsaWMgTGljZW5zZSAyLjBcbiAqIHdoaWNoIGlzIGF2YWlsYWJsZSBhdCBodHRwczovL3d3dy5lY2xpcHNlLm9yZy9sZWdhbC9lcGwtMi4wL1xuICpcbiAqICBTUERYLUxpY2Vuc2UtSWRlbnRpZmllcjogRVBMLTIuMFxuICovXG5cbi8qXG4gKiBTZWNvbmRhcnkgZW50cnlwb2ludDogJ0BzY2lvbi9jb21wb25lbnRzL2RpbWVuc2lvbidcbiAqXG4gKiBAc2VlIGh0dHBzOi8vZ2l0aHViLmNvbS9uZy1wYWNrYWdyL25nLXBhY2thZ3IvYmxvYi9tYXN0ZXIvZG9jcy9zZWNvbmRhcnktZW50cnlwb2ludHMubWRcbiAqL1xuZXhwb3J0IHtTY2lEaW1lbnNpb25Nb2R1bGV9IGZyb20gJy4vZGltZW5zaW9uLm1vZHVsZSc7XG5leHBvcnQge1NjaURpbWVuc2lvbkRpcmVjdGl2ZX0gZnJvbSAnLi9kaW1lbnNpb24uZGlyZWN0aXZlJztcbmV4cG9ydCB7ZGltZW5zaW9ufSBmcm9tICcuL2RpbWVuc2lvbi5zaWduYWwnO1xuZXhwb3J0IHtib3VuZGluZ0NsaWVudFJlY3R9IGZyb20gJy4vYm91bmRpbmctY2xpZW50LXJlY3Quc2lnbmFsJztcbmV4cG9ydCB7U2NpRGltZW5zaW9ufSBmcm9tICcuL2RpbWVuc2lvbic7XG4iXX0=

package/fesm2022/scion-components-dimension.mjs

@@ -1,9 +1,11 @@
 import * as i0 from '@angular/core';
-import { input, output, inject, ElementRef, NgZone, Directive, NgModule } from '@angular/core';
-import { fromResize$ } from '@scion/toolkit/observable';
+import { input, output, inject, ElementRef, NgZone, Directive, NgModule, assertNotInReactiveContext, assertInInjectionContext, Injector, computed, isSignal, signal, effect, untracked } from '@angular/core';
+import { fromResize$, fromBoundingClientRect$ } from '@scion/toolkit/observable';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { subscribeInside, observeInside } from '@scion/toolkit/operators';
 import { subscribeOn, animationFrameScheduler, observeOn } from 'rxjs';
+import { coerceElement } from '@angular/cdk/coercion';
+import { Objects } from '@scion/toolkit/util';
 
 /*
  * Copyright (c) 2018-2024 Swiss Federal Railways
@@ -15,9 +17,7 @@ import { subscribeOn, animationFrameScheduler, observeOn } from 'rxjs';
  *  SPDX-License-Identifier: EPL-2.0
  */
 /**
- * Observes changes to the size of the host element.
- *
- * Upon subscription, emits the current size, and then continuously when the size changes. The Observable never completes.
+ * Observes the size of the host element.
  *
  * ---
  * Usage:
@@ -29,18 +29,18 @@ import { subscribeOn, animationFrameScheduler, observeOn } from 'rxjs';
 class SciDimensionDirective {
     constructor() {
         /**
-         * Controls if to emit outside the Angular zone. Defaults to `false`.
+         * Controls if to output outside the Angular zone. Defaults to `false`.
          */
         this.emitOutsideAngular = input(false);
         /**
-         * Upon subscription, emits the current size, and then continuously when the size changes. The Observable never completes.
+         * Outputs the size of the element.
          */
         this.dimensionChange = output({ alias: 'sciDimensionChange' });
         const host = inject((ElementRef)).nativeElement;
         const zone = inject(NgZone);
         fromResize$(host)
-            .pipe(subscribeInside(continueFn => zone.runOutsideAngular(continueFn)), observeInside(continueFn => this.emitOutsideAngular() ? continueFn() : zone.run(continueFn)), subscribeOn(animationFrameScheduler), // to not block resize callback (ResizeObserver loop completed with undelivered notifications)
-        observeOn(animationFrameScheduler), // to not block resize callback (ResizeObserver loop completed with undelivered notifications)
+            .pipe(subscribeInside(continueFn => zone.runOutsideAngular(continueFn)), observeInside(continueFn => this.emitOutsideAngular() ? continueFn() : zone.run(continueFn)), subscribeOn(animationFrameScheduler), // do not block resize callback (ResizeObserver loop completed with undelivered notifications)
+        observeOn(animationFrameScheduler), // do not block resize callback (ResizeObserver loop completed with undelivered notifications)
         takeUntilDestroyed())
             .subscribe(() => {
             this.dimensionChange.emit({
@@ -94,6 +94,107 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImpor
                 }]
         }] });
 
+/*
+ * Copyright (c) 2018-2024 Swiss Federal Railways
+ *
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ */
+function dimension(elementLike, options) {
+    assertNotInReactiveContext(dimension, 'Invoking `dimension` causes new subscriptions every time. Move `dimension` outside of the reactive context and read the signal value where needed.');
+    if (!options?.injector) {
+        assertInInjectionContext(dimension);
+    }
+    const injector = options?.injector ?? inject(Injector);
+    const zone = injector.get(NgZone);
+    const element = computed(() => coerceElement(isSignal(elementLike) ? elementLike() : elementLike));
+    const onResize = signal(undefined, { equal: () => false });
+    // Subscribe to element size changes.
+    effect(onCleanup => {
+        const el = element();
+        if (!el) {
+            return;
+        }
+        untracked(() => {
+            const subscription = fromResize$(el)
+                .pipe(subscribeInside(fn => zone.runOutsideAngular(fn)), observeOn(animationFrameScheduler))
+                .subscribe(() => {
+                NgZone.assertNotInAngularZone();
+                onResize.set();
+            });
+            onCleanup(() => subscription.unsubscribe());
+        });
+    }, { injector });
+    // Create signal that recomputes each time the size changes.
+    return computed(() => {
+        const el = element();
+        if (!el) {
+            return undefined;
+        }
+        // Track element size.
+        onResize();
+        return {
+            clientWidth: el.clientWidth,
+            offsetWidth: el.offsetWidth,
+            clientHeight: el.clientHeight,
+            offsetHeight: el.offsetHeight,
+            element: el,
+        };
+    }, { equal: Objects.isEqual });
+}
+
+/*
+ * Copyright (c) 2018-2024 Swiss Federal Railways
+ *
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ */
+function boundingClientRect(elementLike, options) {
+    assertNotInReactiveContext(boundingClientRect, 'Invoking `boundingClientRect` causes new subscriptions every time. Move `boundingClientRect` outside of the reactive context and read the signal value where needed.');
+    if (!options?.injector) {
+        assertInInjectionContext(boundingClientRect);
+    }
+    const injector = options?.injector ?? inject(Injector);
+    const zone = injector.get(NgZone);
+    const element = computed(() => coerceElement(isSignal(elementLike) ? elementLike() : elementLike));
+    const onBoundingBoxChange = signal(undefined, { equal: () => false });
+    // Subscribe to element bounding box changes.
+    effect(onCleanup => {
+        const el = element();
+        if (!el) {
+            return;
+        }
+        untracked(() => {
+            const subscription = fromBoundingClientRect$(el)
+                .pipe(subscribeInside(fn => zone.runOutsideAngular(fn)))
+                .subscribe(() => {
+                NgZone.assertNotInAngularZone();
+                onBoundingBoxChange.set();
+            });
+            onCleanup(() => subscription.unsubscribe());
+        });
+    }, { injector });
+    // Create signal that recomputes each time the bounding box changes.
+    return computed(() => {
+        const el = element();
+        if (!el) {
+            return undefined;
+        }
+        // Track bounding box.
+        onBoundingBoxChange();
+        return el.getBoundingClientRect();
+    }, { equal: isEqualDomRect });
+}
+function isEqualDomRect(a, b) {
+    return a?.top === b?.top && a?.right === b?.right && a?.bottom === b?.bottom && a?.left === b?.left;
+}
+
 /*
  * Copyright (c) 2018-2019 Swiss Federal Railways
  *
@@ -113,5 +214,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { SciDimensionDirective, SciDimensionModule };
+export { SciDimensionDirective, SciDimensionModule, boundingClientRect, dimension };
 //# sourceMappingURL=scion-components-dimension.mjs.map

package/fesm2022/scion-components-dimension.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"scion-components-dimension.mjs","sources":["../../../../projects/scion/components/dimension/src/dimension.directive.ts","../../../../projects/scion/components/dimension/src/dimension.module.ts","../../../../projects/scion/components/dimension/src/public_api.ts","../../../../projects/scion/components/dimension/src/scion-components-dimension.ts"],"sourcesContent":["/*\n * Copyright (c) 2018-2024 Swiss Federal Railways\n *\n * This program and the accompanying materials are made\n * available under the terms of the Eclipse Public License 2.0\n * which is available at https://www.eclipse.org/legal/epl-2.0/\n *\n *  SPDX-License-Identifier: EPL-2.0\n */\n\nimport {Directive, ElementRef, inject, input, NgZone, output} from '@angular/core';\nimport {fromResize$} from '@scion/toolkit/observable';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport {observeInside, subscribeInside} from '@scion/toolkit/operators';\nimport {animationFrameScheduler, observeOn, subscribeOn} from 'rxjs';\n\n/**\n * Observes changes to the size of the host element.\n *\n * Upon subscription, emits the current size, and then continuously when the size changes. The Observable never completes.\n *\n * ---\n * Usage:\n *\n * ```html\n * <div sciDimension (sciDimensionChange)=\"onDimensionChange($event)\"></div>\n * ```\n */\n@Directive({\n  selector: '[sciDimension]',\n  standalone: true,\n})\nexport class SciDimensionDirective {\n\n  /**\n   * Controls if to emit outside the Angular zone. Defaults to `false`.\n   */\n  public emitOutsideAngular = input(false);\n\n  /**\n   * Upon subscription, emits the current size, and then continuously when the size changes. The Observable never completes.\n   */\n  public dimensionChange = output<SciDimension>({alias: 'sciDimensionChange'});\n\n  constructor() {\n    const host = inject(ElementRef<HTMLElement>).nativeElement;\n    const zone = inject(NgZone);\n\n    fromResize$(host)\n      .pipe(\n        subscribeInside(continueFn => zone.runOutsideAngular(continueFn)),\n        observeInside(continueFn => this.emitOutsideAngular() ? continueFn() : zone.run(continueFn)),\n        subscribeOn(animationFrameScheduler), // to not block resize callback (ResizeObserver loop completed with undelivered notifications)\n        observeOn(animationFrameScheduler), // to not block resize callback (ResizeObserver loop completed with undelivered notifications)\n        takeUntilDestroyed(),\n      )\n      .subscribe(() => {\n        this.dimensionChange.emit({\n          clientWidth: host.clientWidth,\n          offsetWidth: host.offsetWidth,\n          clientHeight: host.clientHeight,\n          offsetHeight: host.offsetHeight,\n          element: host,\n        });\n      });\n  }\n}\n\n/**\n * Represents the dimension of an element.\n */\nexport interface SciDimension {\n  offsetWidth: number;\n  offsetHeight: number;\n  clientWidth: number;\n  clientHeight: number;\n  element: HTMLElement;\n}\n","/*\n * Copyright (c) 2018-2019 Swiss Federal Railways\n *\n * This program and the accompanying materials are made\n * available under the terms of the Eclipse Public License 2.0\n * which is available at https://www.eclipse.org/legal/epl-2.0/\n *\n *  SPDX-License-Identifier: EPL-2.0\n */\n\nimport {NgModule} from '@angular/core';\nimport {SciDimensionDirective} from './dimension.directive';\n\n/**\n * Provides a directive for observing changes to the size of the host element.\n *\n * @see fromDimension$\n */\n@NgModule({\n  imports: [\n    SciDimensionDirective,\n  ],\n  exports: [\n    SciDimensionDirective,\n  ],\n})\nexport class SciDimensionModule {\n}\n","/*\n * Copyright (c) 2018-2019 Swiss Federal Railways\n *\n * This program and the accompanying materials are made\n * available under the terms of the Eclipse Public License 2.0\n * which is available at https://www.eclipse.org/legal/epl-2.0/\n *\n *  SPDX-License-Identifier: EPL-2.0\n */\n\n/*\n * Secondary entrypoint: '@scion/components/dimension'\n *\n * @see https://github.com/ng-packagr/ng-packagr/blob/master/docs/secondary-entrypoints.md\n */\nexport {SciDimensionModule} from './dimension.module';\nexport {SciDimensionDirective, SciDimension} from './dimension.directive';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;AAAA;;;;;;;;AAQG;AAQH;;;;;;;;;;;AAWG;MAKU,qBAAqB,CAAA;AAYhC,IAAA,WAAA,GAAA;AAVA;;AAEG;AACI,QAAA,IAAA,CAAA,kBAAkB,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC;AAEzC;;AAEG;QACI,IAAe,CAAA,eAAA,GAAG,MAAM,CAAe,EAAC,KAAK,EAAE,oBAAoB,EAAC,CAAC,CAAC;QAG3E,MAAM,IAAI,GAAG,MAAM,EAAC,UAAuB,EAAC,CAAC,aAAa,CAAC;AAC3D,QAAA,MAAM,IAAI,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;QAE5B,WAAW,CAAC,IAAI,CAAC;aACd,IAAI,CACH,eAAe,CAAC,UAAU,IAAI,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAC,EACjE,aAAa,CAAC,UAAU,IAAI,IAAI,CAAC,kBAAkB,EAAE,GAAG,UAAU,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,EAC5F,WAAW,CAAC,uBAAuB,CAAC;AACpC,QAAA,SAAS,CAAC,uBAAuB,CAAC;AAClC,QAAA,kBAAkB,EAAE,CACrB;aACA,SAAS,CAAC,MAAK;AACd,YAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC;gBACxB,WAAW,EAAE,IAAI,CAAC,WAAW;gBAC7B,WAAW,EAAE,IAAI,CAAC,WAAW;gBAC7B,YAAY,EAAE,IAAI,CAAC,YAAY;gBAC/B,YAAY,EAAE,IAAI,CAAC,YAAY;AAC/B,gBAAA,OAAO,EAAE,IAAI;AACd,aAAA,CAAC,CAAC;AACL,SAAC,CAAC,CAAC;KACN;8GAjCU,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAArB,qBAAqB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAA,EAAA,oBAAA,EAAA,UAAA,EAAA,oBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,eAAA,EAAA,oBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA,EAAA;;2FAArB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAJjC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,UAAU,EAAE,IAAI;AACjB,iBAAA,CAAA;;;AC/BD;;;;;;;;AAQG;AAKH;;;;AAIG;MASU,kBAAkB,CAAA;8GAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;+GAAlB,kBAAkB,EAAA,OAAA,EAAA,CAN3B,qBAAqB,CAAA,EAAA,OAAA,EAAA,CAGrB,qBAAqB,CAAA,EAAA,CAAA,CAAA,EAAA;+GAGZ,kBAAkB,EAAA,CAAA,CAAA,EAAA;;2FAAlB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAR9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE;wBACP,qBAAqB;AACtB,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,qBAAqB;AACtB,qBAAA;AACF,iBAAA,CAAA;;;ACzBD;;;;;;;;AAQG;AAEH;;;;AAIG;;ACdH;;AAEG;;;;"}
+{"version":3,"file":"scion-components-dimension.mjs","sources":["../../../../projects/scion/components/dimension/src/dimension.directive.ts","../../../../projects/scion/components/dimension/src/dimension.module.ts","../../../../projects/scion/components/dimension/src/dimension.signal.ts","../../../../projects/scion/components/dimension/src/bounding-client-rect.signal.ts","../../../../projects/scion/components/dimension/src/public_api.ts","../../../../projects/scion/components/dimension/src/scion-components-dimension.ts"],"sourcesContent":["/*\n * Copyright (c) 2018-2024 Swiss Federal Railways\n *\n * This program and the accompanying materials are made\n * available under the terms of the Eclipse Public License 2.0\n * which is available at https://www.eclipse.org/legal/epl-2.0/\n *\n *  SPDX-License-Identifier: EPL-2.0\n */\n\nimport {Directive, ElementRef, inject, input, NgZone, output} from '@angular/core';\nimport {fromResize$} from '@scion/toolkit/observable';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport {observeInside, subscribeInside} from '@scion/toolkit/operators';\nimport {animationFrameScheduler, observeOn, subscribeOn} from 'rxjs';\nimport {SciDimension} from './dimension';\n\n/**\n * Observes the size of the host element.\n *\n * ---\n * Usage:\n *\n * ```html\n * <div sciDimension (sciDimensionChange)=\"onDimensionChange($event)\"></div>\n * ```\n */\n@Directive({\n  selector: '[sciDimension]',\n  standalone: true,\n})\nexport class SciDimensionDirective {\n\n  /**\n   * Controls if to output outside the Angular zone. Defaults to `false`.\n   */\n  public emitOutsideAngular = input(false);\n\n  /**\n   * Outputs the size of the element.\n   */\n  public dimensionChange = output<SciDimension>({alias: 'sciDimensionChange'});\n\n  constructor() {\n    const host = inject(ElementRef<HTMLElement>).nativeElement;\n    const zone = inject(NgZone);\n\n    fromResize$(host)\n      .pipe(\n        subscribeInside(continueFn => zone.runOutsideAngular(continueFn)),\n        observeInside(continueFn => this.emitOutsideAngular() ? continueFn() : zone.run(continueFn)),\n        subscribeOn(animationFrameScheduler), // do not block resize callback (ResizeObserver loop completed with undelivered notifications)\n        observeOn(animationFrameScheduler), // do not block resize callback (ResizeObserver loop completed with undelivered notifications)\n        takeUntilDestroyed(),\n      )\n      .subscribe(() => {\n        this.dimensionChange.emit({\n          clientWidth: host.clientWidth,\n          offsetWidth: host.offsetWidth,\n          clientHeight: host.clientHeight,\n          offsetHeight: host.offsetHeight,\n          element: host,\n        });\n      });\n  }\n}\n","/*\n * Copyright (c) 2018-2019 Swiss Federal Railways\n *\n * This program and the accompanying materials are made\n * available under the terms of the Eclipse Public License 2.0\n * which is available at https://www.eclipse.org/legal/epl-2.0/\n *\n *  SPDX-License-Identifier: EPL-2.0\n */\n\nimport {NgModule} from '@angular/core';\nimport {SciDimensionDirective} from './dimension.directive';\n\n/**\n * Provides a directive for observing changes to the size of the host element.\n *\n * @see fromDimension$\n */\n@NgModule({\n  imports: [\n    SciDimensionDirective,\n  ],\n  exports: [\n    SciDimensionDirective,\n  ],\n})\nexport class SciDimensionModule {\n}\n","/*\n * Copyright (c) 2018-2024 Swiss Federal Railways\n *\n * This program and the accompanying materials are made\n * available under the terms of the Eclipse Public License 2.0\n * which is available at https://www.eclipse.org/legal/epl-2.0/\n *\n * SPDX-License-Identifier: EPL-2.0\n */\n\nimport {assertInInjectionContext, assertNotInReactiveContext, computed, effect, ElementRef, inject, Injector, isSignal, NgZone, signal, Signal, untracked} from '@angular/core';\nimport {SciDimension} from './dimension';\nimport {coerceElement} from '@angular/cdk/coercion';\nimport {Objects} from '@scion/toolkit/util';\nimport {fromResize$} from '@scion/toolkit/observable';\nimport {animationFrameScheduler, observeOn} from 'rxjs';\nimport {subscribeInside} from '@scion/toolkit/operators';\n\n/**\n * Creates a signal observing the size of an element.\n *\n * The element can be passed as a signal, enabling observation of view children in the component constructor.\n *\n * The signal subscribes to the native {@link ResizeObserver} to monitor element size changes. Destroying the injection context will unsubscribe the observer.\n *\n * Usage:\n * - Must be called within an injection context or an injector provided. Destroying the injector will unsubscribe the signal.\n * - Must not be called within a reactive context to avoid repeated subscriptions.\n */\nexport function dimension(elementLike: HTMLElement | ElementRef<HTMLElement> | Signal<HTMLElement | ElementRef<HTMLElement>>, options?: {injector?: Injector}): Signal<SciDimension>;\nexport function dimension(elementLike: HTMLElement | ElementRef<HTMLElement> | Signal<HTMLElement | ElementRef<HTMLElement> | undefined>, options?: {injector?: Injector}): Signal<SciDimension | undefined>;\nexport function dimension(elementLike: HTMLElement | ElementRef<HTMLElement> | Signal<HTMLElement | ElementRef<HTMLElement> | undefined>, options?: {injector?: Injector}): Signal<SciDimension | undefined> {\n  assertNotInReactiveContext(dimension, 'Invoking `dimension` causes new subscriptions every time. Move `dimension` outside of the reactive context and read the signal value where needed.');\n  if (!options?.injector) {\n    assertInInjectionContext(dimension);\n  }\n\n  const injector = options?.injector ?? inject(Injector);\n  const zone = injector.get(NgZone);\n  const element = computed(() => coerceElement(isSignal(elementLike) ? elementLike() : elementLike));\n  const onResize = signal<void>(undefined, {equal: () => false});\n\n  // Subscribe to element size changes.\n  effect(onCleanup => {\n    const el = element();\n    if (!el) {\n      return;\n    }\n\n    untracked(() => {\n      const subscription = fromResize$(el)\n        .pipe(\n          subscribeInside(fn => zone.runOutsideAngular(fn)),\n          observeOn(animationFrameScheduler), // do not block resize callback (ResizeObserver loop completed with undelivered notifications)\n        )\n        .subscribe(() => {\n          NgZone.assertNotInAngularZone();\n          onResize.set();\n        });\n      onCleanup(() => subscription.unsubscribe());\n    });\n  }, {injector});\n\n  // Create signal that recomputes each time the size changes.\n  return computed(() => {\n    const el = element();\n    if (!el) {\n      return undefined;\n    }\n\n    // Track element size.\n    onResize();\n\n    return {\n      clientWidth: el.clientWidth,\n      offsetWidth: el.offsetWidth,\n      clientHeight: el.clientHeight,\n      offsetHeight: el.offsetHeight,\n      element: el,\n    };\n  }, {equal: Objects.isEqual});\n}\n","/*\n * Copyright (c) 2018-2024 Swiss Federal Railways\n *\n * This program and the accompanying materials are made\n * available under the terms of the Eclipse Public License 2.0\n * which is available at https://www.eclipse.org/legal/epl-2.0/\n *\n * SPDX-License-Identifier: EPL-2.0\n */\n\nimport {assertInInjectionContext, assertNotInReactiveContext, computed, effect, ElementRef, inject, Injector, isSignal, NgZone, signal, Signal, untracked} from '@angular/core';\nimport {coerceElement} from '@angular/cdk/coercion';\nimport {fromBoundingClientRect$} from '@scion/toolkit/observable';\nimport {subscribeInside} from '@scion/toolkit/operators';\n\n/**\n * Creates a signal observing the bounding box of an element.\n *\n * The bounding box includes the element's position relative to the top-left of the viewport and its size.\n * Refer to https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect for more details.\n *\n * The element can be passed as a signal, enabling observation of view children in the component constructor.\n *\n * There is no native browser API to observe the position of an element. The signal uses {@link IntersectionObserver} and\n * {@link ResizeObserver} to detect position changes. For tracking only size changes, use the {@link dimension} signal instead.\n *\n * Usage:\n * - Must be called within an injection context or an injector provided. Destroying the injector will unsubscribe the signal.\n * - Must not be called within a reactive context to avoid repeated subscriptions.\n * - The element and the document root (`<html>`) must be positioned `relative` or `absolute`. If not, a warning is logged, and positioning changed to `relative`.\n */\nexport function boundingClientRect(elementLike: HTMLElement | ElementRef<HTMLElement> | Signal<HTMLElement | ElementRef<HTMLElement>>, options?: {injector?: Injector}): Signal<DOMRect>;\nexport function boundingClientRect(elementLike: HTMLElement | ElementRef<HTMLElement> | Signal<HTMLElement | ElementRef<HTMLElement> | undefined>, options?: {injector?: Injector}): Signal<DOMRect | undefined>;\nexport function boundingClientRect(elementLike: HTMLElement | ElementRef<HTMLElement> | Signal<HTMLElement | ElementRef<HTMLElement> | undefined>, options?: {injector?: Injector}): Signal<DOMRect | undefined> {\n  assertNotInReactiveContext(boundingClientRect, 'Invoking `boundingClientRect` causes new subscriptions every time. Move `boundingClientRect` outside of the reactive context and read the signal value where needed.');\n  if (!options?.injector) {\n    assertInInjectionContext(boundingClientRect);\n  }\n\n  const injector = options?.injector ?? inject(Injector);\n  const zone = injector.get(NgZone);\n  const element = computed(() => coerceElement(isSignal(elementLike) ? elementLike() : elementLike));\n  const onBoundingBoxChange = signal<void>(undefined, {equal: () => false});\n\n  // Subscribe to element bounding box changes.\n  effect(onCleanup => {\n    const el = element();\n    if (!el) {\n      return;\n    }\n\n    untracked(() => {\n      const subscription = fromBoundingClientRect$(el)\n        .pipe(subscribeInside(fn => zone.runOutsideAngular(fn)))\n        .subscribe(() => {\n          NgZone.assertNotInAngularZone();\n          onBoundingBoxChange.set();\n        });\n      onCleanup(() => subscription.unsubscribe());\n    });\n  }, {injector});\n\n  // Create signal that recomputes each time the bounding box changes.\n  return computed(() => {\n    const el = element();\n    if (!el) {\n      return undefined;\n    }\n\n    // Track bounding box.\n    onBoundingBoxChange();\n\n    return el.getBoundingClientRect();\n  }, {equal: isEqualDomRect});\n}\n\nfunction isEqualDomRect(a: DOMRect | undefined, b: DOMRect | undefined): boolean {\n  return a?.top === b?.top && a?.right === b?.right && a?.bottom === b?.bottom && a?.left === b?.left;\n}\n","/*\n * Copyright (c) 2018-2019 Swiss Federal Railways\n *\n * This program and the accompanying materials are made\n * available under the terms of the Eclipse Public License 2.0\n * which is available at https://www.eclipse.org/legal/epl-2.0/\n *\n *  SPDX-License-Identifier: EPL-2.0\n */\n\n/*\n * Secondary entrypoint: '@scion/components/dimension'\n *\n * @see https://github.com/ng-packagr/ng-packagr/blob/master/docs/secondary-entrypoints.md\n */\nexport {SciDimensionModule} from './dimension.module';\nexport {SciDimensionDirective} from './dimension.directive';\nexport {dimension} from './dimension.signal';\nexport {boundingClientRect} from './bounding-client-rect.signal';\nexport {SciDimension} from './dimension';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scion/components",
-  "version": "18.0.1",
+  "version": "18.1.0",
   "description": "Provides a collection of Angular components and directives primarily for use in SCION libraries such as `@scion/workbench` and `@scion/microfrontend-platform`. This library is not a comprehensive component library as its focus is on SCION requirements.",
   "license": "EPL-2.0",
   "private": false,