@scion/components 18.1.0 → 19.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dimension/dimension.module.d.ts +2 -0
- package/dimension/public_api.d.ts +1 -1
- package/fesm2022/scion-components-dimension.mjs +36 -23
- package/fesm2022/scion-components-dimension.mjs.map +1 -1
- package/fesm2022/scion-components-sashbox.mjs +73 -43
- package/fesm2022/scion-components-sashbox.mjs.map +1 -1
- package/fesm2022/scion-components-splitter.mjs +40 -33
- package/fesm2022/scion-components-splitter.mjs.map +1 -1
- package/fesm2022/scion-components-throbber.mjs +39 -39
- package/fesm2022/scion-components-throbber.mjs.map +1 -1
- package/fesm2022/scion-components-viewport.mjs +225 -277
- package/fesm2022/scion-components-viewport.mjs.map +1 -1
- package/package.json +5 -17
- package/sashbox/sashbox.module.d.ts +2 -0
- package/splitter/public_api.d.ts +1 -1
- package/splitter/splitter.module.d.ts +2 -0
- package/throbber/throbber.module.d.ts +2 -0
- package/viewport/native-scrollbar-track-size-provider.service.d.ts +6 -16
- package/viewport/public_api.d.ts +1 -1
- package/viewport/scrollable.directive.d.ts +9 -10
- package/viewport/scrollbar/scrollbar.component.d.ts +17 -32
- package/viewport/viewport.component.d.ts +14 -16
- package/viewport/viewport.module.d.ts +2 -0
- package/esm2022/dimension/bounding-client-rect.signal.mjs +0 -53
- package/esm2022/dimension/dimension.directive.mjs +0 -62
- package/esm2022/dimension/dimension.mjs +0 -11
- package/esm2022/dimension/dimension.module.mjs +0 -34
- package/esm2022/dimension/dimension.signal.mjs +0 -58
- package/esm2022/dimension/public_api.mjs +0 -19
- package/esm2022/dimension/scion-components-dimension.mjs +0 -5
- package/esm2022/public-api.mjs +0 -11
- package/esm2022/sashbox/element-ref.directive.mjs +0 -31
- package/esm2022/sashbox/public_api.mjs +0 -18
- package/esm2022/sashbox/sash-initializer.directive.mjs +0 -35
- package/esm2022/sashbox/sash.directive.mjs +0 -145
- package/esm2022/sashbox/sashbox-accessor.mjs +0 -6
- package/esm2022/sashbox/sashbox.component.mjs +0 -282
- package/esm2022/sashbox/sashbox.module.mjs +0 -55
- package/esm2022/sashbox/scion-components-sashbox.mjs +0 -5
- package/esm2022/scion-components.mjs +0 -5
- package/esm2022/splitter/public_api.mjs +0 -17
- package/esm2022/splitter/scion-components-splitter.mjs +0 -5
- package/esm2022/splitter/splitter.component.mjs +0 -226
- package/esm2022/splitter/splitter.module.mjs +0 -38
- package/esm2022/throbber/ellipsis-throbber/ellipsis-throbber.component.mjs +0 -25
- package/esm2022/throbber/public_api.mjs +0 -17
- package/esm2022/throbber/ripple-throbber/ripple-throbber.component.mjs +0 -25
- package/esm2022/throbber/roller-throbber/roller-throbber.component.mjs +0 -25
- package/esm2022/throbber/scion-components-throbber.mjs +0 -5
- package/esm2022/throbber/spinner-throbber/spinner-throbber.component.mjs +0 -26
- package/esm2022/throbber/throbber.component.mjs +0 -72
- package/esm2022/throbber/throbber.module.mjs +0 -32
- package/esm2022/viewport/native-scrollbar-track-size-provider.service.mjs +0 -115
- package/esm2022/viewport/public_api.mjs +0 -19
- package/esm2022/viewport/scion-components-viewport.mjs +0 -5
- package/esm2022/viewport/scrollable.directive.mjs +0 -94
- package/esm2022/viewport/scrollbar/scrollbar.component.mjs +0 -323
- package/esm2022/viewport/viewport.component.mjs +0 -288
- package/esm2022/viewport/viewport.module.mjs +0 -42
|
@@ -3,6 +3,8 @@ import * as i1 from "./dimension.directive";
|
|
|
3
3
|
/**
|
|
4
4
|
* Provides a directive for observing changes to the size of the host element.
|
|
5
5
|
*
|
|
6
|
+
* @deprecated since version 19.0.0; Import standalone directive instead; API will be removed in a future release.
|
|
7
|
+
*
|
|
6
8
|
* @see fromDimension$
|
|
7
9
|
*/
|
|
8
10
|
export declare class SciDimensionModule {
|
|
@@ -2,4 +2,4 @@ export { SciDimensionModule } from './dimension.module';
|
|
|
2
2
|
export { SciDimensionDirective } from './dimension.directive';
|
|
3
3
|
export { dimension } from './dimension.signal';
|
|
4
4
|
export { boundingClientRect } from './bounding-client-rect.signal';
|
|
5
|
-
export { SciDimension } from './dimension';
|
|
5
|
+
export { type SciDimension } from './dimension';
|
|
@@ -2,8 +2,7 @@ import * as i0 from '@angular/core';
|
|
|
2
2
|
import { input, output, inject, ElementRef, NgZone, Directive, NgModule, assertNotInReactiveContext, assertInInjectionContext, Injector, computed, isSignal, signal, effect, untracked } from '@angular/core';
|
|
3
3
|
import { fromResize$, fromBoundingClientRect$ } from '@scion/toolkit/observable';
|
|
4
4
|
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
5
|
-
import {
|
|
6
|
-
import { subscribeOn, animationFrameScheduler, observeOn } from 'rxjs';
|
|
5
|
+
import { subscribeIn, observeIn } from '@scion/toolkit/operators';
|
|
7
6
|
import { coerceElement } from '@angular/cdk/coercion';
|
|
8
7
|
import { Objects } from '@scion/toolkit/util';
|
|
9
8
|
|
|
@@ -27,22 +26,28 @@ import { Objects } from '@scion/toolkit/util';
|
|
|
27
26
|
* ```
|
|
28
27
|
*/
|
|
29
28
|
class SciDimensionDirective {
|
|
29
|
+
/**
|
|
30
|
+
* Controls if to output outside the Angular zone. Defaults to `false`.
|
|
31
|
+
*/
|
|
32
|
+
emitOutsideAngular = input(false);
|
|
33
|
+
/**
|
|
34
|
+
* Outputs the size of the element.
|
|
35
|
+
*/
|
|
36
|
+
dimensionChange = output({ alias: 'sciDimensionChange' });
|
|
30
37
|
constructor() {
|
|
31
|
-
/**
|
|
32
|
-
* Controls if to output outside the Angular zone. Defaults to `false`.
|
|
33
|
-
*/
|
|
34
|
-
this.emitOutsideAngular = input(false);
|
|
35
|
-
/**
|
|
36
|
-
* Outputs the size of the element.
|
|
37
|
-
*/
|
|
38
|
-
this.dimensionChange = output({ alias: 'sciDimensionChange' });
|
|
39
38
|
const host = inject((ElementRef)).nativeElement;
|
|
40
39
|
const zone = inject(NgZone);
|
|
41
40
|
fromResize$(host)
|
|
42
|
-
.pipe(
|
|
43
|
-
|
|
44
|
-
|
|
41
|
+
.pipe(
|
|
42
|
+
// Avoid triggering change detection cycle.
|
|
43
|
+
subscribeIn(fn => zone.runOutsideAngular(fn)),
|
|
44
|
+
// Run in animation frame to prevent 'ResizeObserver loop completed with undelivered notifications' error.
|
|
45
|
+
// Do not use `animationFrameScheduler` because the scheduler does not necessarily execute in the current execution context, such as inside or outside Angular.
|
|
46
|
+
// The scheduler always executes tasks in the context (e.g. zone) where the scheduler was first used in the application.
|
|
47
|
+
observeIn(fn => requestAnimationFrame(fn)), observeIn(fn => this.emitOutsideAngular() ? fn() : zone.run(fn)), takeUntilDestroyed())
|
|
45
48
|
.subscribe(() => {
|
|
49
|
+
// Assert Angular zone.
|
|
50
|
+
this.emitOutsideAngular() ? NgZone.assertNotInAngularZone() : NgZone.assertInAngularZone();
|
|
46
51
|
this.dimensionChange.emit({
|
|
47
52
|
clientWidth: host.clientWidth,
|
|
48
53
|
offsetWidth: host.offsetWidth,
|
|
@@ -52,14 +57,13 @@ class SciDimensionDirective {
|
|
|
52
57
|
});
|
|
53
58
|
});
|
|
54
59
|
}
|
|
55
|
-
static
|
|
56
|
-
static
|
|
60
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciDimensionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
61
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.0", type: SciDimensionDirective, isStandalone: true, selector: "[sciDimension]", inputs: { emitOutsideAngular: { classPropertyName: "emitOutsideAngular", publicName: "emitOutsideAngular", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dimensionChange: "sciDimensionChange" }, ngImport: i0 });
|
|
57
62
|
}
|
|
58
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
63
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciDimensionDirective, decorators: [{
|
|
59
64
|
type: Directive,
|
|
60
65
|
args: [{
|
|
61
66
|
selector: '[sciDimension]',
|
|
62
|
-
standalone: true,
|
|
63
67
|
}]
|
|
64
68
|
}], ctorParameters: () => [] });
|
|
65
69
|
|
|
@@ -75,14 +79,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImpor
|
|
|
75
79
|
/**
|
|
76
80
|
* Provides a directive for observing changes to the size of the host element.
|
|
77
81
|
*
|
|
82
|
+
* @deprecated since version 19.0.0; Import standalone directive instead; API will be removed in a future release.
|
|
83
|
+
*
|
|
78
84
|
* @see fromDimension$
|
|
79
85
|
*/
|
|
80
86
|
class SciDimensionModule {
|
|
81
|
-
static
|
|
82
|
-
static
|
|
83
|
-
static
|
|
87
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciDimensionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
88
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.0", ngImport: i0, type: SciDimensionModule, imports: [SciDimensionDirective], exports: [SciDimensionDirective] });
|
|
89
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciDimensionModule });
|
|
84
90
|
}
|
|
85
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
91
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciDimensionModule, decorators: [{
|
|
86
92
|
type: NgModule,
|
|
87
93
|
args: [{
|
|
88
94
|
imports: [
|
|
@@ -120,7 +126,13 @@ function dimension(elementLike, options) {
|
|
|
120
126
|
}
|
|
121
127
|
untracked(() => {
|
|
122
128
|
const subscription = fromResize$(el)
|
|
123
|
-
.pipe(
|
|
129
|
+
.pipe(
|
|
130
|
+
// Avoid triggering change detection cycle.
|
|
131
|
+
subscribeIn(fn => zone.runOutsideAngular(fn)),
|
|
132
|
+
// Run in animation frame to prevent 'ResizeObserver loop completed with undelivered notifications' error.
|
|
133
|
+
// Do not use `animationFrameScheduler` because the scheduler does not necessarily execute in the current execution context, such as inside or outside Angular.
|
|
134
|
+
// The scheduler always executes tasks in the context (e.g. zone) where the scheduler was first used in the application.
|
|
135
|
+
observeIn(fn => requestAnimationFrame(fn)))
|
|
124
136
|
.subscribe(() => {
|
|
125
137
|
NgZone.assertNotInAngularZone();
|
|
126
138
|
onResize.set();
|
|
@@ -172,7 +184,8 @@ function boundingClientRect(elementLike, options) {
|
|
|
172
184
|
}
|
|
173
185
|
untracked(() => {
|
|
174
186
|
const subscription = fromBoundingClientRect$(el)
|
|
175
|
-
|
|
187
|
+
// Avoid triggering change detection cycle.
|
|
188
|
+
.pipe(subscribeIn(fn => zone.runOutsideAngular(fn)))
|
|
176
189
|
.subscribe(() => {
|
|
177
190
|
NgZone.assertNotInAngularZone();
|
|
178
191
|
onBoundingBoxChange.set();
|
|
@@ -1 +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/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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"}
|
|
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/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 {observeIn, subscribeIn} from '@scion/toolkit/operators';\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})\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 // Avoid triggering change detection cycle.\n subscribeIn(fn => zone.runOutsideAngular(fn)),\n // Run in animation frame to prevent 'ResizeObserver loop completed with undelivered notifications' error.\n // Do not use `animationFrameScheduler` because the scheduler does not necessarily execute in the current execution context, such as inside or outside Angular.\n // The scheduler always executes tasks in the context (e.g. zone) where the scheduler was first used in the application.\n observeIn(fn => requestAnimationFrame(fn)),\n observeIn(fn => this.emitOutsideAngular() ? fn() : zone.run(fn)),\n takeUntilDestroyed(),\n )\n .subscribe(() => {\n // Assert Angular zone.\n this.emitOutsideAngular() ? NgZone.assertNotInAngularZone() : NgZone.assertInAngularZone();\n\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 * @deprecated since version 19.0.0; Import standalone directive instead; API will be removed in a future release.\n *\n * @see fromDimension$\n */\n@NgModule({ // TODO [Angular 20] Remove deprecated 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 {observeIn, subscribeIn} 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 // Avoid triggering change detection cycle.\n subscribeIn(fn => zone.runOutsideAngular(fn)),\n // Run in animation frame to prevent 'ResizeObserver loop completed with undelivered notifications' error.\n // Do not use `animationFrameScheduler` because the scheduler does not necessarily execute in the current execution context, such as inside or outside Angular.\n // The scheduler always executes tasks in the context (e.g. zone) where the scheduler was first used in the application.\n observeIn(fn => requestAnimationFrame(fn)),\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 {subscribeIn} 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 // Avoid triggering change detection cycle.\n .pipe(subscribeIn(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 {type SciDimension} from './dimension';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
|
@@ -40,6 +40,10 @@ class SciSashBoxAccessor {
|
|
|
40
40
|
* </sci-sashbox>
|
|
41
41
|
*/
|
|
42
42
|
class SciSashDirective {
|
|
43
|
+
sashTemplate;
|
|
44
|
+
_sashBoxAccessor;
|
|
45
|
+
_size = '1';
|
|
46
|
+
_flexGrow$ = new BehaviorSubject(0);
|
|
43
47
|
/**
|
|
44
48
|
* Specifies the sash size, either as fixed size with an explicit unit,
|
|
45
49
|
* or as a unitless proportion to distibute remaining space. A proportional
|
|
@@ -53,6 +57,17 @@ class SciSashDirective {
|
|
|
53
57
|
get size() {
|
|
54
58
|
return this._size;
|
|
55
59
|
}
|
|
60
|
+
/**
|
|
61
|
+
* Specifies the minimal sash size in pixel or percent.
|
|
62
|
+
* The min-size prevents the user from shrinking the sash below this minimal size.
|
|
63
|
+
*
|
|
64
|
+
* If the unit is omitted, the value is interpreted as a pixel value.
|
|
65
|
+
*/
|
|
66
|
+
minSize;
|
|
67
|
+
/**
|
|
68
|
+
* @internal
|
|
69
|
+
*/
|
|
70
|
+
element;
|
|
56
71
|
/**
|
|
57
72
|
* @internal
|
|
58
73
|
*/
|
|
@@ -65,11 +80,23 @@ class SciSashDirective {
|
|
|
65
80
|
get flexGrow() {
|
|
66
81
|
return this._flexGrow$.value;
|
|
67
82
|
}
|
|
83
|
+
/**
|
|
84
|
+
* @internal
|
|
85
|
+
*/
|
|
86
|
+
flexShrink;
|
|
87
|
+
/**
|
|
88
|
+
* @internal
|
|
89
|
+
*/
|
|
90
|
+
flexBasis;
|
|
91
|
+
/**
|
|
92
|
+
* Normalized flex-grow proportion of this sash, which is a value >= 1.
|
|
93
|
+
*
|
|
94
|
+
* @internal
|
|
95
|
+
*/
|
|
96
|
+
flexGrowNormalized$;
|
|
68
97
|
constructor(sashTemplate, _sashBoxAccessor) {
|
|
69
98
|
this.sashTemplate = sashTemplate;
|
|
70
99
|
this._sashBoxAccessor = _sashBoxAccessor;
|
|
71
|
-
this._size = '1';
|
|
72
|
-
this._flexGrow$ = new BehaviorSubject(0);
|
|
73
100
|
this.flexGrowNormalized$ = this._sashBoxAccessor.sashes$
|
|
74
101
|
.pipe(switchMap(sashes => merge(...sashes.map(sash => sash._flexGrow$))), map(() => this.normalizeFlexGrow(this.flexGrow)));
|
|
75
102
|
}
|
|
@@ -135,15 +162,14 @@ class SciSashDirective {
|
|
|
135
162
|
}
|
|
136
163
|
return flexGrow / flexGrowSum;
|
|
137
164
|
}
|
|
138
|
-
static
|
|
139
|
-
static
|
|
165
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciSashDirective, deps: [{ token: i0.TemplateRef }, { token: SciSashBoxAccessor }], target: i0.ɵɵFactoryTarget.Directive });
|
|
166
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: SciSashDirective, isStandalone: true, selector: "ng-template[sciSash]", inputs: { size: "size", minSize: "minSize" }, exportAs: ["sciSash"], usesOnChanges: true, ngImport: i0 });
|
|
140
167
|
}
|
|
141
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
168
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciSashDirective, decorators: [{
|
|
142
169
|
type: Directive,
|
|
143
170
|
args: [{
|
|
144
171
|
selector: 'ng-template[sciSash]',
|
|
145
172
|
exportAs: 'sciSash',
|
|
146
|
-
standalone: true,
|
|
147
173
|
}]
|
|
148
174
|
}], ctorParameters: () => [{ type: i0.TemplateRef }, { type: SciSashBoxAccessor }], propDecorators: { size: [{
|
|
149
175
|
type: Input
|
|
@@ -164,20 +190,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImpor
|
|
|
164
190
|
* Initializes {SashDirective} with the target {HTMLDivElement}.
|
|
165
191
|
*/
|
|
166
192
|
class SciSashInitializerDirective {
|
|
193
|
+
_host;
|
|
194
|
+
sash;
|
|
167
195
|
constructor(_host) {
|
|
168
196
|
this._host = _host;
|
|
169
197
|
}
|
|
170
198
|
ngOnChanges(changes) {
|
|
171
199
|
this.sash.element = this._host.nativeElement;
|
|
172
200
|
}
|
|
173
|
-
static
|
|
174
|
-
static
|
|
201
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciSashInitializerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
202
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: SciSashInitializerDirective, isStandalone: true, selector: "div[sciSashInitializer].sash", inputs: { sash: ["sciSashInitializer", "sash"] }, usesOnChanges: true, ngImport: i0 });
|
|
175
203
|
}
|
|
176
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
204
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciSashInitializerDirective, decorators: [{
|
|
177
205
|
type: Directive,
|
|
178
206
|
args: [{
|
|
179
207
|
selector: 'div[sciSashInitializer].sash',
|
|
180
|
-
standalone: true,
|
|
181
208
|
}]
|
|
182
209
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { sash: [{
|
|
183
210
|
type: Input,
|
|
@@ -197,19 +224,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImpor
|
|
|
197
224
|
* Provides access to the native {@link HTMLElement} of the host.
|
|
198
225
|
*/
|
|
199
226
|
class SciElementRefDirective {
|
|
227
|
+
host;
|
|
228
|
+
nativeElement;
|
|
200
229
|
constructor(host) {
|
|
201
230
|
this.host = host;
|
|
202
231
|
this.nativeElement = host.nativeElement;
|
|
203
232
|
}
|
|
204
|
-
static
|
|
205
|
-
static
|
|
233
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciElementRefDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
234
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: SciElementRefDirective, isStandalone: true, selector: "[sciElementRef]", exportAs: ["sciElementRef"], ngImport: i0 });
|
|
206
235
|
}
|
|
207
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
236
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciElementRefDirective, decorators: [{
|
|
208
237
|
type: Directive,
|
|
209
238
|
args: [{
|
|
210
239
|
selector: '[sciElementRef]',
|
|
211
240
|
exportAs: 'sciElementRef',
|
|
212
|
-
standalone: true,
|
|
213
241
|
}]
|
|
214
242
|
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
|
215
243
|
|
|
@@ -276,25 +304,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImpor
|
|
|
276
304
|
* ```
|
|
277
305
|
*/
|
|
278
306
|
class SciSashboxComponent {
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
307
|
+
_destroy$ = new Subject();
|
|
308
|
+
_host = inject((ElementRef)).nativeElement;
|
|
309
|
+
_zone = inject(NgZone);
|
|
310
|
+
sashes$ = new BehaviorSubject([]);
|
|
311
|
+
sashing = false;
|
|
312
|
+
maxHeight;
|
|
313
|
+
maxWidth;
|
|
314
|
+
/**
|
|
315
|
+
* Specifies if to lay out sashes in a row (which is by default) or column arrangement.
|
|
316
|
+
*/
|
|
317
|
+
direction = 'row';
|
|
318
|
+
/**
|
|
319
|
+
* Emits when start sashing.
|
|
320
|
+
*/
|
|
321
|
+
sashStart = new EventEmitter();
|
|
322
|
+
/**
|
|
323
|
+
* Emits the absolute sash sizes (px) when finished sashing.
|
|
324
|
+
*/
|
|
325
|
+
sashEnd = new EventEmitter();
|
|
298
326
|
/** @internal */
|
|
299
327
|
set setSashes(queryList) {
|
|
300
328
|
queryList.changes
|
|
@@ -415,15 +443,15 @@ class SciSashboxComponent {
|
|
|
415
443
|
}
|
|
416
444
|
return parseInt(value, 10);
|
|
417
445
|
}
|
|
418
|
-
static
|
|
419
|
-
static
|
|
446
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciSashboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
447
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.0", type: SciSashboxComponent, isStandalone: true, selector: "sci-sashbox", inputs: { direction: "direction" }, outputs: { sashStart: "sashStart", sashEnd: "sashEnd" }, host: { properties: { "class.sashing": "this.sashing", "style.--\u0275sci-sashbox-max-height": "this.maxHeight", "style.--\u0275sci-sashbox-max-width": "this.maxWidth", "class.column": "this.isColumnDirection", "class.row": "this.isRowDirection" } }, providers: [{
|
|
420
448
|
provide: SciSashBoxAccessor,
|
|
421
449
|
useFactory: provideSashBoxAccessor,
|
|
422
|
-
}], queries: [{ propertyName: "setSashes", predicate: SciSashDirective }], ngImport: i0, template: "@for (sash of sashes$ | async; track sash; let i = $index; let first = $first; let last = $last) {\n <div class=\"sash\"\n [class.first]=\"first\"\n [class.last]=\"last\"\n [sciSashInitializer]=\"sash\"\n [style.flex-grow]=\"sash.flexGrowNormalized$ | async\"\n [style.flex-shrink]=\"sash.flexShrink\"\n [style.flex-basis]=\"sash.flexBasis\">\n <ng-container *ngTemplateOutlet=\"sash.sashTemplate\"/>\n </div>\n @if (!last) {\n <sci-splitter sciElementRef #sciElementRef=\"sciElementRef\"\n [orientation]=\"isRowDirection ? 'vertical' : 'horizontal'\"\n (start)=\"onSashStart()\"\n (move)=\"onSash(sciElementRef.nativeElement, i, $event)\"\n (end)=\"onSashEnd()\"\n (reset)=\"onSashReset(i)\"/>\n }\n}\n", styles: ["@charset \"UTF-8\";:host{display:flex;align-items:stretch;box-sizing:border-box;overflow:hidden;z-index:0}:host *{box-sizing:border-box}:host.column{flex-direction:column}:host.row{flex-direction:row}:host>div.sash{overflow:hidden;display:grid;grid-auto-rows:100%;grid-auto-columns:100%}:host.row>div.sash{margin:0 var(--sci-sashbox-gap)}:host.row>div.sash.first{margin-left:0}:host.row>div.sash.last{margin-right:0}:host.column>div.sash{margin:var(--sci-sashbox-gap) 0}:host.column>div.sash.first{margin-top:0}:host.column>div.sash.last{margin-bottom:0}:host.sashing{max-height:calc(var(--\\275sci-sashbox-max-height) * 1px);max-width:calc(var(--\\275sci-sashbox-max-width) * 1px)}:host.sashing>div.sash{pointer-events:none}:host>sci-splitter{--sci-splitter-background-color: var(--sci-sashbox-splitter-background-color);--sci-splitter-background-color-hover: var(--sci-sashbox-splitter-background-color-hover);--sci-splitter-size: var(--sci-sashbox-splitter-size);--sci-splitter-size-hover: var(--sci-sashbox-splitter-size-hover);--sci-splitter-touch-target-size: var(--sci-sashbox-splitter-touch-target-size);--sci-splitter-cross-axis-size: var(--sci-sashbox-splitter-cross-axis-size);--sci-splitter-border-radius: var(--sci-sashbox-splitter-border-radius);--sci-splitter-opacity-active: var(--sci-sashbox-splitter-opacity-active);--sci-splitter-opacity-hover: var(--sci-sashbox-splitter-opacity-hover);flex:none;z-index:1}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: SciSashInitializerDirective, selector: "div[sciSashInitializer].sash", inputs: ["sciSashInitializer"] }, { kind: "component", type: SciSplitterComponent, selector: "sci-splitter", inputs: ["orientation"], outputs: ["start", "move", "end", "reset"] }, { kind: "directive", type: SciElementRefDirective, selector: "[sciElementRef]", exportAs: ["sciElementRef"] }] });
|
|
450
|
+
}], queries: [{ propertyName: "setSashes", predicate: SciSashDirective }], ngImport: i0, template: "@for (sash of sashes$ | async; track sash; let i = $index; let first = $first; let last = $last) {\n <div class=\"sash\"\n [class.first]=\"first\"\n [class.last]=\"last\"\n [sciSashInitializer]=\"sash\"\n [style.flex-grow]=\"sash.flexGrowNormalized$ | async\"\n [style.flex-shrink]=\"sash.flexShrink\"\n [style.flex-basis]=\"sash.flexBasis\">\n <ng-container *ngTemplateOutlet=\"sash.sashTemplate\"/>\n </div>\n @if (!last) {\n <sci-splitter sciElementRef #sciElementRef=\"sciElementRef\"\n [orientation]=\"isRowDirection ? 'vertical' : 'horizontal'\"\n (start)=\"onSashStart()\"\n (move)=\"onSash(sciElementRef.nativeElement, i, $event)\"\n (end)=\"onSashEnd()\"\n (reset)=\"onSashReset(i)\"/>\n }\n}\n", styles: ["@charset \"UTF-8\";:host{display:flex;align-items:stretch;box-sizing:border-box;overflow:hidden;z-index:0}:host *{box-sizing:border-box}:host.column{flex-direction:column}:host.row{flex-direction:row}:host>div.sash{overflow:hidden;display:grid;grid-auto-rows:100%;grid-auto-columns:100%}:host.row>div.sash{margin:0 var(--sci-sashbox-gap)}:host.row>div.sash.first{margin-left:0}:host.row>div.sash.last{margin-right:0}:host.column>div.sash{margin:var(--sci-sashbox-gap) 0}:host.column>div.sash.first{margin-top:0}:host.column>div.sash.last{margin-bottom:0}:host.sashing{max-height:calc(var(--\\275sci-sashbox-max-height) * 1px);max-width:calc(var(--\\275sci-sashbox-max-width) * 1px)}:host.sashing>div.sash{pointer-events:none}:host>sci-splitter{--sci-splitter-background-color: var(--sci-sashbox-splitter-background-color);--sci-splitter-background-color-hover: var(--sci-sashbox-splitter-background-color-hover);--sci-splitter-size: var(--sci-sashbox-splitter-size);--sci-splitter-size-hover: var(--sci-sashbox-splitter-size-hover);--sci-splitter-touch-target-size: var(--sci-sashbox-splitter-touch-target-size);--sci-splitter-cross-axis-size: var(--sci-sashbox-splitter-cross-axis-size);--sci-splitter-border-radius: var(--sci-sashbox-splitter-border-radius);--sci-splitter-opacity-active: var(--sci-sashbox-splitter-opacity-active);--sci-splitter-opacity-hover: var(--sci-sashbox-splitter-opacity-hover);flex:none;z-index:1}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: SciSashInitializerDirective, selector: "div[sciSashInitializer].sash", inputs: ["sciSashInitializer"] }, { kind: "component", type: SciSplitterComponent, selector: "sci-splitter", inputs: ["orientation"], outputs: ["start", "move", "end", "reset"] }, { kind: "directive", type: SciElementRefDirective, selector: "[sciElementRef]", exportAs: ["sciElementRef"] }] });
|
|
423
451
|
}
|
|
424
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
452
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciSashboxComponent, decorators: [{
|
|
425
453
|
type: Component,
|
|
426
|
-
args: [{ selector: 'sci-sashbox',
|
|
454
|
+
args: [{ selector: 'sci-sashbox', imports: [
|
|
427
455
|
AsyncPipe,
|
|
428
456
|
NgTemplateOutlet,
|
|
429
457
|
SciSashInitializerDirective,
|
|
@@ -514,15 +542,17 @@ function provideSashBoxAccessor() {
|
|
|
514
542
|
* </ng-template>
|
|
515
543
|
* </sci-sashbox>
|
|
516
544
|
* ```
|
|
545
|
+
*
|
|
546
|
+
* @deprecated since version 19.0.0; Import standalone component and directive instead; API will be removed in a future release.
|
|
517
547
|
*/
|
|
518
548
|
class SciSashboxModule {
|
|
519
|
-
static
|
|
520
|
-
static
|
|
549
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciSashboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
550
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.0", ngImport: i0, type: SciSashboxModule, imports: [SciSashboxComponent,
|
|
521
551
|
SciSashDirective], exports: [SciSashboxComponent,
|
|
522
|
-
SciSashDirective] });
|
|
523
|
-
static
|
|
552
|
+
SciSashDirective] });
|
|
553
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciSashboxModule, imports: [SciSashboxComponent] });
|
|
524
554
|
}
|
|
525
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
555
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: SciSashboxModule, decorators: [{
|
|
526
556
|
type: NgModule,
|
|
527
557
|
args: [{
|
|
528
558
|
imports: [
|