npm - @scion/components - Versions diffs - 17.0.0 → 18.0.0 - Mend

@scion/components 17.0.0 → 18.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.

Files changed (32) hide show

package/fesm2022/scion-components-splitter.mjs CHANGED Viewed

@@ -189,12 +189,12 @@ class SciSplitterComponent {
     ngOnDestroy() {
         this._destroy$.next();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciSplitterComponent, deps: [{ token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.2", type: SciSplitterComponent, isStandalone: true, selector: "sci-splitter", inputs: { orientation: "orientation" }, outputs: { start: "start", move: "move", end: "end", reset: "reset" }, host: { properties: { "class.moving": "this.moving", "class.vertical": "this.isVertical", "class.horizontal": "this.isHorizontal", "style.cursor": "this.splitterCursor" } }, viewQueries: [{ propertyName: "touchTargetElementRef", first: true, predicate: ["touch_target"], descendants: true, static: true }], ngImport: i0, template: "<div #touch_target class=\"touch-target\">\n  <div class=\"handle\"></div>\n</div>\n", styles: ["@charset \"UTF-8\";:host{--\\275sci-splitter-background-color: var(--sci-splitter-background-color, var(--sci-splitter-bgcolor, #d2d2d2));--\\275sci-splitter-background-color-hover: var(--sci-splitter-background-color-hover, var(--sci-splitter-bgcolor_hover, var(--\\275sci-splitter-background-color)));--\\275sci-splitter-size: var(--sci-splitter-size, 1px);--\\275sci-splitter-size-hover: var(--sci-splitter-size-hover, var(--sci-splitter-size_hover, 8px));--\\275sci-splitter-touch-target-size: var(--sci-splitter-touch-target-size, 15px);--\\275sci-splitter-cross-axis-size: var(--sci-splitter-cross-axis-size, 100%);--\\275sci-splitter-border-radius: var(--sci-splitter-border-radius, 0);--\\275sci-splitter-opacity-active: var(--sci-splitter-opacity-active, var(--sci-splitter-opacity_active, 1));--\\275sci-splitter-opacity-hover: var(--sci-splitter-opacity-hover, var(--sci-splitter-opacity_hover, .3));display:grid;position:relative;background-color:var(--\\275sci-splitter-background-color);border-radius:var(--\\275sci-splitter-border-radius);place-items:center;align-self:center}:host>div.touch-target{position:absolute;display:grid;place-items:center;pointer-events:auto}:host>div.touch-target>div.handle{position:absolute;background-color:var(--\\275sci-splitter-background-color);border-radius:var(--\\275sci-splitter-border-radius);opacity:var(--\\275sci-splitter-opacity-hover);transition-property:width,height;transition-timing-function:ease-in;transition-duration:75ms}:host.vertical{width:var(--\\275sci-splitter-size);height:var(--\\275sci-splitter-cross-axis-size)}:host.vertical>div.touch-target{width:var(--\\275sci-splitter-touch-target-size);height:100%}:host.vertical>div.touch-target>div.handle{width:var(--\\275sci-splitter-size);height:100%}:host.horizontal{height:var(--\\275sci-splitter-size);width:var(--\\275sci-splitter-cross-axis-size)}:host.horizontal>div.touch-target{width:100%;height:var(--\\275sci-splitter-touch-target-size)}:host.horizontal>div.touch-target>div.handle{width:100%;height:var(--\\275sci-splitter-size)}:host>div.touch-target:active>div.handle{opacity:var(--\\275sci-splitter-opacity-active)}:host.vertical.moving>div.touch-target>div.handle,:host.vertical>div.touch-target:hover>div.handle{background-color:var(--\\275sci-splitter-background-color-hover);width:var(--\\275sci-splitter-size-hover)}:host.horizontal.moving>div.touch-target>div.handle,:host.horizontal>div.touch-target:hover>div.handle{background-color:var(--\\275sci-splitter-background-color-hover);height:var(--\\275sci-splitter-size-hover)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciSplitterComponent, deps: [{ token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.1", type: SciSplitterComponent, isStandalone: true, selector: "sci-splitter", inputs: { orientation: "orientation" }, outputs: { start: "start", move: "move", end: "end", reset: "reset" }, host: { properties: { "class.moving": "this.moving", "class.vertical": "this.isVertical", "class.horizontal": "this.isHorizontal", "style.cursor": "this.splitterCursor" } }, viewQueries: [{ propertyName: "touchTargetElementRef", first: true, predicate: ["touch_target"], descendants: true, static: true }], ngImport: i0, template: "<div #touch_target class=\"touch-target\">\n  <div class=\"handle\"></div>\n</div>\n", styles: [":host{display:grid;position:relative;background-color:var(--sci-splitter-background-color);border-radius:var(--sci-splitter-border-radius);place-items:center;align-self:center}:host>div.touch-target{position:absolute;display:grid;place-items:center;pointer-events:auto}:host>div.touch-target>div.handle{position:absolute;background-color:var(--sci-splitter-background-color);border-radius:var(--sci-splitter-border-radius);opacity:var(--sci-splitter-opacity-hover);transition-property:width,height;transition-timing-function:ease-in;transition-duration:75ms}:host.vertical{width:var(--sci-splitter-size);height:var(--sci-splitter-cross-axis-size)}:host.vertical>div.touch-target{width:var(--sci-splitter-touch-target-size);height:100%}:host.vertical>div.touch-target>div.handle{width:var(--sci-splitter-size);height:100%}:host.horizontal{height:var(--sci-splitter-size);width:var(--sci-splitter-cross-axis-size)}:host.horizontal>div.touch-target{width:100%;height:var(--sci-splitter-touch-target-size)}:host.horizontal>div.touch-target>div.handle{width:100%;height:var(--sci-splitter-size)}:host>div.touch-target:active>div.handle{opacity:var(--sci-splitter-opacity-active)}:host.vertical.moving>div.touch-target>div.handle,:host.vertical>div.touch-target:hover>div.handle{background-color:var(--sci-splitter-background-color-hover);width:var(--sci-splitter-size-hover)}:host.horizontal.moving>div.touch-target>div.handle,:host.horizontal>div.touch-target:hover>div.handle{background-color:var(--sci-splitter-background-color-hover);height:var(--sci-splitter-size-hover)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciSplitterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciSplitterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sci-splitter', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div #touch_target class=\"touch-target\">\n  <div class=\"handle\"></div>\n</div>\n", styles: ["@charset \"UTF-8\";:host{--\\275sci-splitter-background-color: var(--sci-splitter-background-color, var(--sci-splitter-bgcolor, #d2d2d2));--\\275sci-splitter-background-color-hover: var(--sci-splitter-background-color-hover, var(--sci-splitter-bgcolor_hover, var(--\\275sci-splitter-background-color)));--\\275sci-splitter-size: var(--sci-splitter-size, 1px);--\\275sci-splitter-size-hover: var(--sci-splitter-size-hover, var(--sci-splitter-size_hover, 8px));--\\275sci-splitter-touch-target-size: var(--sci-splitter-touch-target-size, 15px);--\\275sci-splitter-cross-axis-size: var(--sci-splitter-cross-axis-size, 100%);--\\275sci-splitter-border-radius: var(--sci-splitter-border-radius, 0);--\\275sci-splitter-opacity-active: var(--sci-splitter-opacity-active, var(--sci-splitter-opacity_active, 1));--\\275sci-splitter-opacity-hover: var(--sci-splitter-opacity-hover, var(--sci-splitter-opacity_hover, .3));display:grid;position:relative;background-color:var(--\\275sci-splitter-background-color);border-radius:var(--\\275sci-splitter-border-radius);place-items:center;align-self:center}:host>div.touch-target{position:absolute;display:grid;place-items:center;pointer-events:auto}:host>div.touch-target>div.handle{position:absolute;background-color:var(--\\275sci-splitter-background-color);border-radius:var(--\\275sci-splitter-border-radius);opacity:var(--\\275sci-splitter-opacity-hover);transition-property:width,height;transition-timing-function:ease-in;transition-duration:75ms}:host.vertical{width:var(--\\275sci-splitter-size);height:var(--\\275sci-splitter-cross-axis-size)}:host.vertical>div.touch-target{width:var(--\\275sci-splitter-touch-target-size);height:100%}:host.vertical>div.touch-target>div.handle{width:var(--\\275sci-splitter-size);height:100%}:host.horizontal{height:var(--\\275sci-splitter-size);width:var(--\\275sci-splitter-cross-axis-size)}:host.horizontal>div.touch-target{width:100%;height:var(--\\275sci-splitter-touch-target-size)}:host.horizontal>div.touch-target>div.handle{width:100%;height:var(--\\275sci-splitter-size)}:host>div.touch-target:active>div.handle{opacity:var(--\\275sci-splitter-opacity-active)}:host.vertical.moving>div.touch-target>div.handle,:host.vertical>div.touch-target:hover>div.handle{background-color:var(--\\275sci-splitter-background-color-hover);width:var(--\\275sci-splitter-size-hover)}:host.horizontal.moving>div.touch-target>div.handle,:host.horizontal>div.touch-target:hover>div.handle{background-color:var(--\\275sci-splitter-background-color-hover);height:var(--\\275sci-splitter-size-hover)}\n"] }]
+            args: [{ selector: 'sci-splitter', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div #touch_target class=\"touch-target\">\n  <div class=\"handle\"></div>\n</div>\n", styles: [":host{display:grid;position:relative;background-color:var(--sci-splitter-background-color);border-radius:var(--sci-splitter-border-radius);place-items:center;align-self:center}:host>div.touch-target{position:absolute;display:grid;place-items:center;pointer-events:auto}:host>div.touch-target>div.handle{position:absolute;background-color:var(--sci-splitter-background-color);border-radius:var(--sci-splitter-border-radius);opacity:var(--sci-splitter-opacity-hover);transition-property:width,height;transition-timing-function:ease-in;transition-duration:75ms}:host.vertical{width:var(--sci-splitter-size);height:var(--sci-splitter-cross-axis-size)}:host.vertical>div.touch-target{width:var(--sci-splitter-touch-target-size);height:100%}:host.vertical>div.touch-target>div.handle{width:var(--sci-splitter-size);height:100%}:host.horizontal{height:var(--sci-splitter-size);width:var(--sci-splitter-cross-axis-size)}:host.horizontal>div.touch-target{width:100%;height:var(--sci-splitter-touch-target-size)}:host.horizontal>div.touch-target>div.handle{width:100%;height:var(--sci-splitter-size)}:host>div.touch-target:active>div.handle{opacity:var(--sci-splitter-opacity-active)}:host.vertical.moving>div.touch-target>div.handle,:host.vertical>div.touch-target:hover>div.handle{background-color:var(--sci-splitter-background-color-hover);width:var(--sci-splitter-size-hover)}:host.horizontal.moving>div.touch-target>div.handle,:host.horizontal>div.touch-target:hover>div.handle{background-color:var(--sci-splitter-background-color-hover);height:var(--sci-splitter-size-hover)}\n"] }]
         }], ctorParameters: () => [{ type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
@@ -244,11 +244,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImpor
  * ```
  */
 class SciSplitterModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciSplitterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.2", ngImport: i0, type: SciSplitterModule, imports: [SciSplitterComponent], exports: [SciSplitterComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciSplitterModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciSplitterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.1", ngImport: i0, type: SciSplitterModule, imports: [SciSplitterComponent], exports: [SciSplitterComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciSplitterModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciSplitterModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciSplitterModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/fesm2022/scion-components-splitter.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"scion-components-splitter.mjs","sources":["../../../../projects/scion/components/splitter/src/splitter.component.ts","../../../../projects/scion/components/splitter/src/splitter.component.html","../../../../projects/scion/components/splitter/src/splitter.module.ts","../../../../projects/scion/components/splitter/src/public_api.ts","../../../../projects/scion/components/splitter/src/scion-components-splitter.ts"],"sourcesContent":["/\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 {ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, HostBinding, Inject, Input, NgZone, OnDestroy, OnInit, Output, ViewChild} from '@angular/core';\nimport {fromEvent, merge, Subject} from 'rxjs';\nimport {DOCUMENT} from '@angular/common';\nimport {tapFirst} from '@scion/toolkit/operators';\nimport {first, takeUntil} from 'rxjs/operators';\n\n/\n Represents a splitter, a visual element that allows the user to control the size of elements next to it.\n \n The splitter has a handle that the user can move depending on the orientation of the splitter.\n \n Note that this control neither does change the size of adjacent elements nor does it (re-)position itself, but emits the distance by\n * which the user has theoretically moved the splitter. You must subscribe to these events and change your layout accordingly.\n \n In the toolkit, {@link SciSashboxComponent} uses this splitter to divide a layout into several resizable sections.\n * Another use case would be a resizable sidebar panel.\n \n ### Usage\n \n ```html\n * <sci-splitter (move)=\"onSplitterMove($event.distance)\"></sci-splitter>\n * ```\n \n ### Styling\n \n To customize the default look of SCION components or support different themes, configure the `@scion/components` SCSS module in `styles.scss`.\n * To style a specific `sci-splitter` component, the following CSS variables can be set directly on the component.\n \n - --sci-splitter-background-color: Sets the background color of the splitter.\n * - --sci-splitter-background-color-hover: Sets the background color of the splitter when hovering it.\n * - --sci-splitter-size: Sets the size of the splitter along the main axis.\n * - --sci-splitter-size-hover: Sets the size of the splitter along the main axis when hovering it.\n * - --sci-splitter-touch-target-size: Sets the touch target size to move the splitter (accessibility).\n * - --sci-splitter-cross-axis-size: Sets the splitter size along the cross axis.\n * - --sci-splitter-border-radius: Sets the border radius of the splitter.\n * - --sci-splitter-opacity-active: Sets the opacity of the splitter while the user moves the splitter.\n * - --sci-splitter-opacity-hover: Sets the opacity of the splitter when hovering it.\n \n Example:\n \n ```scss\n * sci-splitter {\n * --sci-splitter-background-color: black;\n * --sci-splitter-background-color-hover: black;\n * }\n * ```\n /\n@Component({\n selector: 'sci-splitter',\n templateUrl: './splitter.component.html',\n styleUrls: ['./splitter.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n})\nexport class SciSplitterComponent implements OnInit, OnDestroy {\n\n private _destroy$ = new Subject<void>();\n\n / @docs-private /\n @HostBinding('class.moving')\n public moving = false;\n\n @HostBinding('class.vertical')\n public get isVertical(): boolean {\n return !this.isHorizontal;\n }\n\n @HostBinding('class.horizontal')\n public get isHorizontal(): boolean {\n return this.orientation === 'horizontal';\n }\n\n /\n Controls whether to render a vertical or horizontal splitter.\n * By default, if not specified, renders a vertical splitter.\n /\n @Input()\n public orientation: 'vertical' \| 'horizontal' = 'vertical';\n\n /\n Emits when starting to move the splitter.\n /\n @Output()\n public start = new EventEmitter<void>(); // eslint-disable-line @angular-eslint/no-output-native\n\n /\n Emits the distance in pixels when the splitter is moved.\n * The event is emitted outside of the Angular zone.\n /\n @Output()\n public move = new EventEmitter<SplitterMoveEvent>();\n\n /\n Emits when ending to move the splitter.\n /\n @Output()\n public end = new EventEmitter<void>(); // eslint-disable-line @angular-eslint/no-output-native\n\n /\n Emits when to reset the splitter position.\n /\n @Output()\n public reset = new EventEmitter<void>(); // eslint-disable-line @angular-eslint/no-output-native\n\n / @docs-private /\n @HostBinding('style.cursor')\n public get splitterCursor(): string {\n return this.isVertical ? 'ew-resize' : 'ns-resize';\n }\n\n / @docs-private /\n @ViewChild('touch_target', {static: true})\n public touchTargetElementRef!: ElementRef<HTMLElement>;\n\n constructor(private _zone: NgZone,\n private _cd: ChangeDetectorRef,\n @Inject(DOCUMENT) private _document: Document) {\n }\n\n / @docs-private /\n public ngOnInit(): void {\n fromEvent(this.touchTargetElementRef.nativeElement, 'dblclick')\n .pipe(takeUntil(this._destroy$))\n .subscribe(() => this.onReset());\n\n fromEvent<TouchEvent>(this.touchTargetElementRef.nativeElement, 'touchstart')\n .pipe(takeUntil(this._destroy$))\n .subscribe((event: TouchEvent) => this.onTouchStart(event));\n\n fromEvent<MouseEvent>(this.touchTargetElementRef.nativeElement, 'mousedown')\n .pipe(takeUntil(this._destroy$))\n .subscribe((event: MouseEvent) => this.onMouseDown(event));\n }\n\n private onReset(): void {\n this.reset.emit();\n }\n\n private onTouchStart(startEvent: TouchEvent): void {\n this.installMoveListener({\n startEvent: startEvent,\n moveEventNames: ['touchmove'],\n endEventNames: ['touchend', 'touchcancel'],\n eventPositionFn: (touchEvent: TouchEvent): EventPosition => {\n const touch: Touch = touchEvent.touches[0];\n if (this.isVertical) {\n return {screenPos: touch.screenX, clientPos: touch.clientX, pagePos: touch.pageX};\n }\n else {\n return {screenPos: touch.screenY, clientPos: touch.clientY, pagePos: touch.pageY};\n }\n },\n },\n );\n }\n\n private onMouseDown(startEvent: MouseEvent): void {\n if (startEvent.button !== 0) {\n return;\n }\n\n this.installMoveListener({\n startEvent: startEvent,\n moveEventNames: ['mousemove', 'sci-mousemove'],\n endEventNames: ['mouseup', 'sci-mouseup'],\n eventPositionFn: (mouseEvent: MouseEvent): EventPosition => {\n if (this.isVertical) {\n return {screenPos: mouseEvent.screenX, clientPos: mouseEvent.clientX, pagePos: mouseEvent.pageX};\n }\n else {\n return {screenPos: mouseEvent.screenY, clientPos: mouseEvent.clientY, pagePos: mouseEvent.pageY};\n }\n },\n },\n );\n }\n\n private installMoveListener<EVENT extends Event>(config: {startEvent: EVENT; moveEventNames: string[]; endEventNames: string[]; eventPositionFn: (event: EVENT) => EventPosition}): void {\n const startEvent = config.startEvent;\n\n startEvent.preventDefault();\n\n this._zone.runOutsideAngular(() => {\n // install listeners on document level to allow fast dragging the splitter.\n const moveEvent$ = merge(...config.moveEventNames.map(eventName => fromEvent<EVENT>(this._document, eventName)));\n const endEvent$ = merge(...config.endEventNames.map(eventName => fromEvent<EVENT>(this._document, eventName)));\n let lastClientPos = config.eventPositionFn(startEvent).clientPos;\n\n // Apply cursor on document level to prevent flickering while moving the splitter\n const oldDocumentCursor = this._document.body.style.cursor;\n this._document.body.style.cursor = this.splitterCursor;\n\n // Listen for 'move' events until stop moving the splitter\n moveEvent$\n .pipe(\n tapFirst(() => this._zone.run(() => {\n this.moving = true;\n this.start.next();\n this._cd.markForCheck();\n })),\n takeUntil(merge(endEvent$, this._destroy$)),\n )\n .subscribe((moveEvent: EVENT) => {\n const eventPos = config.eventPositionFn(moveEvent);\n const newClientPos = eventPos.clientPos;\n const distance = newClientPos - lastClientPos;\n lastClientPos = newClientPos;\n\n NgZone.assertNotInAngularZone();\n this.move.emit({distance, position: eventPos});\n });\n\n // Listen for 'end' events; call 'stop propagation' to not close overlays\n endEvent$\n .pipe(first(), takeUntil(this._destroy$))\n .subscribe((endEvent: EVENT) => {\n endEvent.stopPropagation();\n this._document.body.style.cursor = oldDocumentCursor;\n this.moving && this._zone.run(() => {\n this.end.next();\n this.moving = false;\n this._cd.markForCheck();\n });\n });\n });\n }\n\n / @docs-private /\n public ngOnDestroy(): void {\n this._destroy$.next();\n }\n}\n\nexport interface EventPosition {\n clientPos: number;\n pagePos: number;\n screenPos: number;\n}\n\n/\n Event that is emitted when moving the splitter.\n /\nexport interface SplitterMoveEvent {\n /\n The distance in pixels by which the user has moved the splitter since the last emission.\n /\n distance: number;\n /\n The position where the mouse or touch event has occurred.\n /\n position: EventPosition;\n}\n","<div #touch_target class=\"touch-target\">\n <div class=\"handle\"></div>\n</div>\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 {SciSplitterComponent} from './splitter.component';\n\n/\n Provides a splitter, a visual element that allows the user to control the size of elements next to it.\n \n ### Usage:\n \n ```html\n * <sci-splitter (move)=\"onSplitterMove($event.distance)\"></sci-splitter>\n * ```\n /\n@NgModule({\n imports: [\n SciSplitterComponent,\n ],\n exports: [\n SciSplitterComponent,\n ],\n})\nexport class SciSplitterModule {\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/splitter'\n \n @see https://github.com/ng-packagr/ng-packagr/blob/master/docs/secondary-entrypoints.md\n /\nexport {SciSplitterModule} from './splitter.module';\nexport {SciSplitterComponent, SplitterMoveEvent, EventPosition} from './splitter.component';\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-splitter.mjs","sources":["../../../../projects/scion/components/splitter/src/splitter.component.ts","../../../../projects/scion/components/splitter/src/splitter.component.html","../../../../projects/scion/components/splitter/src/splitter.module.ts","../../../../projects/scion/components/splitter/src/public_api.ts","../../../../projects/scion/components/splitter/src/scion-components-splitter.ts"],"sourcesContent":["/\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 {ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, HostBinding, Inject, Input, NgZone, OnDestroy, OnInit, Output, ViewChild} from '@angular/core';\nimport {fromEvent, merge, Subject} from 'rxjs';\nimport {DOCUMENT} from '@angular/common';\nimport {tapFirst} from '@scion/toolkit/operators';\nimport {first, takeUntil} from 'rxjs/operators';\n\n/\n Represents a splitter, a visual element that allows the user to control the size of elements next to it.\n \n The splitter has a handle that the user can move depending on the orientation of the splitter.\n \n Note that this control neither does change the size of adjacent elements nor does it (re-)position itself, but emits the distance by\n * which the user has theoretically moved the splitter. You must subscribe to these events and change your layout accordingly.\n \n In the toolkit, {@link SciSashboxComponent} uses this splitter to divide a layout into several resizable sections.\n * Another use case would be a resizable sidebar panel.\n \n ### Usage\n \n ```html\n * <sci-splitter (move)=\"onSplitterMove($event.distance)\"></sci-splitter>\n * ```\n \n ### Styling\n \n To customize the default look of SCION components or support different themes, configure the `@scion/components` SCSS module in `styles.scss`.\n * To style a specific `sci-splitter` component, the following CSS variables can be set directly on the component.\n \n - --sci-splitter-background-color: Sets the background color of the splitter.\n * - --sci-splitter-background-color-hover: Sets the background color of the splitter when hovering it.\n * - --sci-splitter-size: Sets the size of the splitter along the main axis.\n * - --sci-splitter-size-hover: Sets the size of the splitter along the main axis when hovering it.\n * - --sci-splitter-touch-target-size: Sets the touch target size to move the splitter (accessibility).\n * - --sci-splitter-cross-axis-size: Sets the splitter size along the cross axis.\n * - --sci-splitter-border-radius: Sets the border radius of the splitter.\n * - --sci-splitter-opacity-active: Sets the opacity of the splitter while the user moves the splitter.\n * - --sci-splitter-opacity-hover: Sets the opacity of the splitter when hovering it.\n \n Example:\n \n ```scss\n * sci-splitter {\n * --sci-splitter-background-color: black;\n * --sci-splitter-background-color-hover: black;\n * }\n * ```\n /\n@Component({\n selector: 'sci-splitter',\n templateUrl: './splitter.component.html',\n styleUrls: ['./splitter.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n})\nexport class SciSplitterComponent implements OnInit, OnDestroy {\n\n private _destroy$ = new Subject<void>();\n\n / @docs-private /\n @HostBinding('class.moving')\n public moving = false;\n\n @HostBinding('class.vertical')\n public get isVertical(): boolean {\n return !this.isHorizontal;\n }\n\n @HostBinding('class.horizontal')\n public get isHorizontal(): boolean {\n return this.orientation === 'horizontal';\n }\n\n /\n Controls whether to render a vertical or horizontal splitter.\n * By default, if not specified, renders a vertical splitter.\n /\n @Input()\n public orientation: 'vertical' \| 'horizontal' = 'vertical';\n\n /\n Emits when starting to move the splitter.\n /\n @Output()\n public start = new EventEmitter<void>(); // eslint-disable-line @angular-eslint/no-output-native\n\n /\n Emits the distance in pixels when the splitter is moved.\n * The event is emitted outside of the Angular zone.\n /\n @Output()\n public move = new EventEmitter<SplitterMoveEvent>();\n\n /\n Emits when ending to move the splitter.\n /\n @Output()\n public end = new EventEmitter<void>(); // eslint-disable-line @angular-eslint/no-output-native\n\n /\n Emits when to reset the splitter position.\n /\n @Output()\n public reset = new EventEmitter<void>(); // eslint-disable-line @angular-eslint/no-output-native\n\n / @docs-private /\n @HostBinding('style.cursor')\n public get splitterCursor(): string {\n return this.isVertical ? 'ew-resize' : 'ns-resize';\n }\n\n / @docs-private /\n @ViewChild('touch_target', {static: true})\n public touchTargetElementRef!: ElementRef<HTMLElement>;\n\n constructor(private _zone: NgZone,\n private _cd: ChangeDetectorRef,\n @Inject(DOCUMENT) private _document: Document) {\n }\n\n / @docs-private /\n public ngOnInit(): void {\n fromEvent(this.touchTargetElementRef.nativeElement, 'dblclick')\n .pipe(takeUntil(this._destroy$))\n .subscribe(() => this.onReset());\n\n fromEvent<TouchEvent>(this.touchTargetElementRef.nativeElement, 'touchstart')\n .pipe(takeUntil(this._destroy$))\n .subscribe((event: TouchEvent) => this.onTouchStart(event));\n\n fromEvent<MouseEvent>(this.touchTargetElementRef.nativeElement, 'mousedown')\n .pipe(takeUntil(this._destroy$))\n .subscribe((event: MouseEvent) => this.onMouseDown(event));\n }\n\n private onReset(): void {\n this.reset.emit();\n }\n\n private onTouchStart(startEvent: TouchEvent): void {\n this.installMoveListener({\n startEvent: startEvent,\n moveEventNames: ['touchmove'],\n endEventNames: ['touchend', 'touchcancel'],\n eventPositionFn: (touchEvent: TouchEvent): EventPosition => {\n const touch: Touch = touchEvent.touches[0];\n if (this.isVertical) {\n return {screenPos: touch.screenX, clientPos: touch.clientX, pagePos: touch.pageX};\n }\n else {\n return {screenPos: touch.screenY, clientPos: touch.clientY, pagePos: touch.pageY};\n }\n },\n },\n );\n }\n\n private onMouseDown(startEvent: MouseEvent): void {\n if (startEvent.button !== 0) {\n return;\n }\n\n this.installMoveListener({\n startEvent: startEvent,\n moveEventNames: ['mousemove', 'sci-mousemove'],\n endEventNames: ['mouseup', 'sci-mouseup'],\n eventPositionFn: (mouseEvent: MouseEvent): EventPosition => {\n if (this.isVertical) {\n return {screenPos: mouseEvent.screenX, clientPos: mouseEvent.clientX, pagePos: mouseEvent.pageX};\n }\n else {\n return {screenPos: mouseEvent.screenY, clientPos: mouseEvent.clientY, pagePos: mouseEvent.pageY};\n }\n },\n },\n );\n }\n\n private installMoveListener<EVENT extends Event>(config: {startEvent: EVENT; moveEventNames: string[]; endEventNames: string[]; eventPositionFn: (event: EVENT) => EventPosition}): void {\n const startEvent = config.startEvent;\n\n startEvent.preventDefault();\n\n this._zone.runOutsideAngular(() => {\n // install listeners on document level to allow fast dragging the splitter.\n const moveEvent$ = merge(...config.moveEventNames.map(eventName => fromEvent<EVENT>(this._document, eventName)));\n const endEvent$ = merge(...config.endEventNames.map(eventName => fromEvent<EVENT>(this._document, eventName)));\n let lastClientPos = config.eventPositionFn(startEvent).clientPos;\n\n // Apply cursor on document level to prevent flickering while moving the splitter\n const oldDocumentCursor = this._document.body.style.cursor;\n this._document.body.style.cursor = this.splitterCursor;\n\n // Listen for 'move' events until stop moving the splitter\n moveEvent$\n .pipe(\n tapFirst(() => this._zone.run(() => {\n this.moving = true;\n this.start.next();\n this._cd.markForCheck();\n })),\n takeUntil(merge(endEvent$, this._destroy$)),\n )\n .subscribe((moveEvent: EVENT) => {\n const eventPos = config.eventPositionFn(moveEvent);\n const newClientPos = eventPos.clientPos;\n const distance = newClientPos - lastClientPos;\n lastClientPos = newClientPos;\n\n NgZone.assertNotInAngularZone();\n this.move.emit({distance, position: eventPos});\n });\n\n // Listen for 'end' events; call 'stop propagation' to not close overlays\n endEvent$\n .pipe(first(), takeUntil(this._destroy$))\n .subscribe((endEvent: EVENT) => {\n endEvent.stopPropagation();\n this._document.body.style.cursor = oldDocumentCursor;\n this.moving && this._zone.run(() => {\n this.end.next();\n this.moving = false;\n this._cd.markForCheck();\n });\n });\n });\n }\n\n / @docs-private /\n public ngOnDestroy(): void {\n this._destroy$.next();\n }\n}\n\nexport interface EventPosition {\n clientPos: number;\n pagePos: number;\n screenPos: number;\n}\n\n/\n Event that is emitted when moving the splitter.\n /\nexport interface SplitterMoveEvent {\n /\n The distance in pixels by which the user has moved the splitter since the last emission.\n /\n distance: number;\n /\n The position where the mouse or touch event has occurred.\n /\n position: EventPosition;\n}\n","<div #touch_target class=\"touch-target\">\n <div class=\"handle\"></div>\n</div>\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 {SciSplitterComponent} from './splitter.component';\n\n/\n Provides a splitter, a visual element that allows the user to control the size of elements next to it.\n \n ### Usage:\n \n ```html\n * <sci-splitter (move)=\"onSplitterMove($event.distance)\"></sci-splitter>\n * ```\n /\n@NgModule({\n imports: [\n SciSplitterComponent,\n ],\n exports: [\n SciSplitterComponent,\n ],\n})\nexport class SciSplitterModule {\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/splitter'\n \n @see https://github.com/ng-packagr/ng-packagr/blob/master/docs/secondary-entrypoints.md\n /\nexport {SciSplitterModule} from './splitter.module';\nexport {SciSplitterComponent, SplitterMoveEvent, EventPosition} from './splitter.component';\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/scion-components-throbber.mjs CHANGED Viewed

@@ -17,12 +17,12 @@ import { NgSwitch, NgSwitchCase, NgSwitchDefault } from '@angular/common';
  * Throbber type: `ellipsis`
  */
 class SciEllipsisThrobberComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciEllipsisThrobberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.2", type: SciEllipsisThrobberComponent, isStandalone: true, selector: "sci-ellipsis-throbber", ngImport: i0, template: "<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n", styles: ["@charset \"UTF-8\";:host{display:inline-flex;justify-content:space-between;font-size:var(--\\275sci-throbber-size);width:1em;box-sizing:border-box}:host>div.point{flex:none;border-radius:50%;width:.3em;height:.3em;animation:sci-ellipsis-throbber var(--\\275sci-throbber-duration) ease-in-out infinite;background-color:var(--\\275sci-throbber-color)}:host>div.point:nth-child(1){animation-delay:calc(var(--\\275sci-throbber-duration) / -6)}:host>div.point:nth-child(2){animation-delay:calc(var(--\\275sci-throbber-duration) / -12)}@keyframes sci-ellipsis-throbber{0%{transform:scale(0)}40%{transform:scale(1)}80%,to{transform:scale(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciEllipsisThrobberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.1", type: SciEllipsisThrobberComponent, isStandalone: true, selector: "sci-ellipsis-throbber", ngImport: i0, template: "<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n", styles: [":host{display:inline-flex;justify-content:space-between;font-size:var(--sci-throbber-size);width:1em;box-sizing:border-box}:host>div.point{flex:none;border-radius:50%;width:.3em;height:.3em;animation:sci-ellipsis-throbber var(--sci-throbber-duration) ease-in-out infinite;background-color:var(--sci-throbber-color)}:host>div.point:nth-child(1){animation-delay:calc(var(--sci-throbber-duration) / -6)}:host>div.point:nth-child(2){animation-delay:calc(var(--sci-throbber-duration) / -12)}@keyframes sci-ellipsis-throbber{0%{transform:scale(0)}40%{transform:scale(1)}80%,to{transform:scale(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciEllipsisThrobberComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciEllipsisThrobberComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sci-ellipsis-throbber', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n", styles: ["@charset \"UTF-8\";:host{display:inline-flex;justify-content:space-between;font-size:var(--\\275sci-throbber-size);width:1em;box-sizing:border-box}:host>div.point{flex:none;border-radius:50%;width:.3em;height:.3em;animation:sci-ellipsis-throbber var(--\\275sci-throbber-duration) ease-in-out infinite;background-color:var(--\\275sci-throbber-color)}:host>div.point:nth-child(1){animation-delay:calc(var(--\\275sci-throbber-duration) / -6)}:host>div.point:nth-child(2){animation-delay:calc(var(--\\275sci-throbber-duration) / -12)}@keyframes sci-ellipsis-throbber{0%{transform:scale(0)}40%{transform:scale(1)}80%,to{transform:scale(0)}}\n"] }]
+            args: [{ selector: 'sci-ellipsis-throbber', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n", styles: [":host{display:inline-flex;justify-content:space-between;font-size:var(--sci-throbber-size);width:1em;box-sizing:border-box}:host>div.point{flex:none;border-radius:50%;width:.3em;height:.3em;animation:sci-ellipsis-throbber var(--sci-throbber-duration) ease-in-out infinite;background-color:var(--sci-throbber-color)}:host>div.point:nth-child(1){animation-delay:calc(var(--sci-throbber-duration) / -6)}:host>div.point:nth-child(2){animation-delay:calc(var(--sci-throbber-duration) / -12)}@keyframes sci-ellipsis-throbber{0%{transform:scale(0)}40%{transform:scale(1)}80%,to{transform:scale(0)}}\n"] }]
         }] });
 /*
@@ -40,12 +40,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImpor
  * Throbber type: `ripple`
  */
 class SciRippleThrobberComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciRippleThrobberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.2", type: SciRippleThrobberComponent, isStandalone: true, selector: "sci-ripple-throbber", ngImport: i0, template: "<div class=\"circle\"></div>\n<div class=\"circle\"></div>\n", styles: ["@charset \"UTF-8\";:host{display:inline-block;position:relative;font-size:var(--\\275sci-throbber-size);width:1em;height:1em;box-sizing:border-box}:host>div.circle{position:absolute;width:1em;height:1em;border-radius:50%;border:0 solid var(--\\275sci-throbber-color);animation:sci-ripple-throbber var(--\\275sci-throbber-duration) cubic-bezier(0,.2,.8,1) infinite}:host>div.circle:nth-child(1){animation-delay:calc(var(--\\275sci-throbber-duration) / -2)}@keyframes sci-ripple-throbber{0%{transform:scale(0);opacity:0;border-width:0}25%{opacity:1;border-width:.1em}50%{opacity:.75}to{transform:scale(1);opacity:0;border-width:.05em}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciRippleThrobberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.1", type: SciRippleThrobberComponent, isStandalone: true, selector: "sci-ripple-throbber", ngImport: i0, template: "<div class=\"circle\"></div>\n<div class=\"circle\"></div>\n", styles: [":host{display:inline-block;position:relative;font-size:var(--sci-throbber-size);width:1em;height:1em;box-sizing:border-box}:host>div.circle{position:absolute;width:1em;height:1em;border-radius:50%;border:0 solid var(--sci-throbber-color);animation:sci-ripple-throbber var(--sci-throbber-duration) cubic-bezier(0,.2,.8,1) infinite}:host>div.circle:nth-child(1){animation-delay:calc(var(--sci-throbber-duration) / -2)}@keyframes sci-ripple-throbber{0%{transform:scale(0);opacity:0;border-width:0}25%{opacity:1;border-width:.1em}50%{opacity:.75}to{transform:scale(1);opacity:0;border-width:.05em}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciRippleThrobberComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciRippleThrobberComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sci-ripple-throbber', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"circle\"></div>\n<div class=\"circle\"></div>\n", styles: ["@charset \"UTF-8\";:host{display:inline-block;position:relative;font-size:var(--\\275sci-throbber-size);width:1em;height:1em;box-sizing:border-box}:host>div.circle{position:absolute;width:1em;height:1em;border-radius:50%;border:0 solid var(--\\275sci-throbber-color);animation:sci-ripple-throbber var(--\\275sci-throbber-duration) cubic-bezier(0,.2,.8,1) infinite}:host>div.circle:nth-child(1){animation-delay:calc(var(--\\275sci-throbber-duration) / -2)}@keyframes sci-ripple-throbber{0%{transform:scale(0);opacity:0;border-width:0}25%{opacity:1;border-width:.1em}50%{opacity:.75}to{transform:scale(1);opacity:0;border-width:.05em}}\n"] }]
+            args: [{ selector: 'sci-ripple-throbber', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"circle\"></div>\n<div class=\"circle\"></div>\n", styles: [":host{display:inline-block;position:relative;font-size:var(--sci-throbber-size);width:1em;height:1em;box-sizing:border-box}:host>div.circle{position:absolute;width:1em;height:1em;border-radius:50%;border:0 solid var(--sci-throbber-color);animation:sci-ripple-throbber var(--sci-throbber-duration) cubic-bezier(0,.2,.8,1) infinite}:host>div.circle:nth-child(1){animation-delay:calc(var(--sci-throbber-duration) / -2)}@keyframes sci-ripple-throbber{0%{transform:scale(0);opacity:0;border-width:0}25%{opacity:1;border-width:.1em}50%{opacity:.75}to{transform:scale(1);opacity:0;border-width:.05em}}\n"] }]
         }] });
 /*
@@ -63,12 +63,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImpor
  * Throbber type: `roller`
  */
 class SciRollerThrobberComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciRollerThrobberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.2", type: SciRollerThrobberComponent, isStandalone: true, selector: "sci-roller-throbber", ngImport: i0, template: "<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>", styles: ["@charset \"UTF-8\";:host{display:inline-flex;justify-content:center;position:relative;font-size:var(--\\275sci-throbber-size);width:1em;height:1em;box-sizing:border-box}:host>div.point{flex:none;position:absolute;transform-origin:.05em .5em;width:.1em;height:.1em;border-radius:50%;background-color:var(--\\275sci-throbber-color)}:host>div.point:nth-child(1){animation:sci-roller-throbber-1 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.02)}@keyframes sci-roller-throbber-1{0%{transform:rotate(-105deg)}to{transform:rotate(255deg)}}:host>div.point:nth-child(2){animation:sci-roller-throbber-2 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.04)}@keyframes sci-roller-throbber-2{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}:host>div.point:nth-child(3){animation:sci-roller-throbber-3 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.06)}@keyframes sci-roller-throbber-3{0%{transform:rotate(-75deg)}to{transform:rotate(285deg)}}:host>div.point:nth-child(4){animation:sci-roller-throbber-4 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.08)}@keyframes sci-roller-throbber-4{0%{transform:rotate(-60deg)}to{transform:rotate(300deg)}}:host>div.point:nth-child(5){animation:sci-roller-throbber-5 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.1)}@keyframes sci-roller-throbber-5{0%{transform:rotate(-45deg)}to{transform:rotate(315deg)}}:host>div.point:nth-child(6){animation:sci-roller-throbber-6 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.12)}@keyframes sci-roller-throbber-6{0%{transform:rotate(-30deg)}to{transform:rotate(330deg)}}:host>div.point:nth-child(7){animation:sci-roller-throbber-7 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.14)}@keyframes sci-roller-throbber-7{0%{transform:rotate(-15deg)}to{transform:rotate(345deg)}}:host>div.point:nth-child(8){animation:sci-roller-throbber-8 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.16)}@keyframes sci-roller-throbber-8{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciRollerThrobberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.1", type: SciRollerThrobberComponent, isStandalone: true, selector: "sci-roller-throbber", ngImport: i0, template: "<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>", styles: [":host{display:inline-flex;justify-content:center;position:relative;font-size:var(--sci-throbber-size);width:1em;height:1em;box-sizing:border-box}:host>div.point{flex:none;position:absolute;transform-origin:.05em .5em;width:.1em;height:.1em;border-radius:50%;background-color:var(--sci-throbber-color)}:host>div.point:nth-child(1){animation:sci-roller-throbber-1 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.02)}@keyframes sci-roller-throbber-1{0%{transform:rotate(-105deg)}to{transform:rotate(255deg)}}:host>div.point:nth-child(2){animation:sci-roller-throbber-2 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.04)}@keyframes sci-roller-throbber-2{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}:host>div.point:nth-child(3){animation:sci-roller-throbber-3 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.06)}@keyframes sci-roller-throbber-3{0%{transform:rotate(-75deg)}to{transform:rotate(285deg)}}:host>div.point:nth-child(4){animation:sci-roller-throbber-4 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.08)}@keyframes sci-roller-throbber-4{0%{transform:rotate(-60deg)}to{transform:rotate(300deg)}}:host>div.point:nth-child(5){animation:sci-roller-throbber-5 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.1)}@keyframes sci-roller-throbber-5{0%{transform:rotate(-45deg)}to{transform:rotate(315deg)}}:host>div.point:nth-child(6){animation:sci-roller-throbber-6 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.12)}@keyframes sci-roller-throbber-6{0%{transform:rotate(-30deg)}to{transform:rotate(330deg)}}:host>div.point:nth-child(7){animation:sci-roller-throbber-7 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.14)}@keyframes sci-roller-throbber-7{0%{transform:rotate(-15deg)}to{transform:rotate(345deg)}}:host>div.point:nth-child(8){animation:sci-roller-throbber-8 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.16)}@keyframes sci-roller-throbber-8{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciRollerThrobberComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciRollerThrobberComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sci-roller-throbber', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>", styles: ["@charset \"UTF-8\";:host{display:inline-flex;justify-content:center;position:relative;font-size:var(--\\275sci-throbber-size);width:1em;height:1em;box-sizing:border-box}:host>div.point{flex:none;position:absolute;transform-origin:.05em .5em;width:.1em;height:.1em;border-radius:50%;background-color:var(--\\275sci-throbber-color)}:host>div.point:nth-child(1){animation:sci-roller-throbber-1 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.02)}@keyframes sci-roller-throbber-1{0%{transform:rotate(-105deg)}to{transform:rotate(255deg)}}:host>div.point:nth-child(2){animation:sci-roller-throbber-2 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.04)}@keyframes sci-roller-throbber-2{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}:host>div.point:nth-child(3){animation:sci-roller-throbber-3 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.06)}@keyframes sci-roller-throbber-3{0%{transform:rotate(-75deg)}to{transform:rotate(285deg)}}:host>div.point:nth-child(4){animation:sci-roller-throbber-4 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.08)}@keyframes sci-roller-throbber-4{0%{transform:rotate(-60deg)}to{transform:rotate(300deg)}}:host>div.point:nth-child(5){animation:sci-roller-throbber-5 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.1)}@keyframes sci-roller-throbber-5{0%{transform:rotate(-45deg)}to{transform:rotate(315deg)}}:host>div.point:nth-child(6){animation:sci-roller-throbber-6 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.12)}@keyframes sci-roller-throbber-6{0%{transform:rotate(-30deg)}to{transform:rotate(330deg)}}:host>div.point:nth-child(7){animation:sci-roller-throbber-7 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.14)}@keyframes sci-roller-throbber-7{0%{transform:rotate(-15deg)}to{transform:rotate(345deg)}}:host>div.point:nth-child(8){animation:sci-roller-throbber-8 var(--\\275sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--\\275sci-throbber-duration) * -.16)}@keyframes sci-roller-throbber-8{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
+            args: [{ selector: 'sci-roller-throbber', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>", styles: [":host{display:inline-flex;justify-content:center;position:relative;font-size:var(--sci-throbber-size);width:1em;height:1em;box-sizing:border-box}:host>div.point{flex:none;position:absolute;transform-origin:.05em .5em;width:.1em;height:.1em;border-radius:50%;background-color:var(--sci-throbber-color)}:host>div.point:nth-child(1){animation:sci-roller-throbber-1 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.02)}@keyframes sci-roller-throbber-1{0%{transform:rotate(-105deg)}to{transform:rotate(255deg)}}:host>div.point:nth-child(2){animation:sci-roller-throbber-2 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.04)}@keyframes sci-roller-throbber-2{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}:host>div.point:nth-child(3){animation:sci-roller-throbber-3 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.06)}@keyframes sci-roller-throbber-3{0%{transform:rotate(-75deg)}to{transform:rotate(285deg)}}:host>div.point:nth-child(4){animation:sci-roller-throbber-4 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.08)}@keyframes sci-roller-throbber-4{0%{transform:rotate(-60deg)}to{transform:rotate(300deg)}}:host>div.point:nth-child(5){animation:sci-roller-throbber-5 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.1)}@keyframes sci-roller-throbber-5{0%{transform:rotate(-45deg)}to{transform:rotate(315deg)}}:host>div.point:nth-child(6){animation:sci-roller-throbber-6 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.12)}@keyframes sci-roller-throbber-6{0%{transform:rotate(-30deg)}to{transform:rotate(330deg)}}:host>div.point:nth-child(7){animation:sci-roller-throbber-7 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.14)}@keyframes sci-roller-throbber-7{0%{transform:rotate(-15deg)}to{transform:rotate(345deg)}}:host>div.point:nth-child(8){animation:sci-roller-throbber-8 var(--sci-throbber-duration) cubic-bezier(.5,0,.5,1) infinite;animation-delay:calc(var(--sci-throbber-duration) * -.16)}@keyframes sci-roller-throbber-8{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
         }] });
 /*
@@ -87,12 +87,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImpor
  * Throbber type: `spinner`
  */
 class SciSpinnerThrobberComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciSpinnerThrobberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.2", type: SciSpinnerThrobberComponent, isStandalone: true, selector: "sci-spinner-throbber", ngImport: i0, template: "<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>", styles: ["@charset \"UTF-8\";:host{display:inline-flex;justify-content:center;position:relative;font-size:var(--\\275sci-throbber-size);width:1em;height:1em;box-sizing:border-box}:host>div.stroke{flex:none;position:absolute;transform-origin:.0375em .5em;width:.075em;height:.25em;opacity:0;border-radius:20%;background-color:var(--\\275sci-throbber-color);animation:sci-spinner-throbber var(--\\275sci-throbber-duration) linear infinite}:host>div.stroke:nth-child(1){transform:rotate(0);animation-delay:calc(var(--\\275sci-throbber-duration) * .0833333333)}:host>div.stroke:nth-child(2){transform:rotate(30deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .1666666667)}:host>div.stroke:nth-child(3){transform:rotate(60deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .25)}:host>div.stroke:nth-child(4){transform:rotate(90deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .3333333333)}:host>div.stroke:nth-child(5){transform:rotate(120deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .4166666667)}:host>div.stroke:nth-child(6){transform:rotate(150deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .5)}:host>div.stroke:nth-child(7){transform:rotate(180deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .5833333333)}:host>div.stroke:nth-child(8){transform:rotate(210deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .6666666667)}:host>div.stroke:nth-child(9){transform:rotate(240deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .75)}:host>div.stroke:nth-child(10){transform:rotate(270deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .8333333333)}:host>div.stroke:nth-child(11){transform:rotate(300deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .9166666667)}:host>div.stroke:nth-child(12){transform:rotate(330deg);animation-delay:calc(var(--\\275sci-throbber-duration) * 1)}@keyframes sci-spinner-throbber{0%{opacity:1}to{opacity:0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciSpinnerThrobberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.1", type: SciSpinnerThrobberComponent, isStandalone: true, selector: "sci-spinner-throbber", ngImport: i0, template: "<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>", styles: [":host{display:inline-flex;justify-content:center;position:relative;font-size:var(--sci-throbber-size);width:1em;height:1em;box-sizing:border-box}:host>div.stroke{flex:none;position:absolute;transform-origin:.0375em .5em;width:.075em;height:.25em;opacity:0;border-radius:20%;background-color:var(--sci-throbber-color);animation:sci-spinner-throbber var(--sci-throbber-duration) linear infinite}:host>div.stroke:nth-child(1){transform:rotate(0);animation-delay:calc(var(--sci-throbber-duration) * .0833333333)}:host>div.stroke:nth-child(2){transform:rotate(30deg);animation-delay:calc(var(--sci-throbber-duration) * .1666666667)}:host>div.stroke:nth-child(3){transform:rotate(60deg);animation-delay:calc(var(--sci-throbber-duration) * .25)}:host>div.stroke:nth-child(4){transform:rotate(90deg);animation-delay:calc(var(--sci-throbber-duration) * .3333333333)}:host>div.stroke:nth-child(5){transform:rotate(120deg);animation-delay:calc(var(--sci-throbber-duration) * .4166666667)}:host>div.stroke:nth-child(6){transform:rotate(150deg);animation-delay:calc(var(--sci-throbber-duration) * .5)}:host>div.stroke:nth-child(7){transform:rotate(180deg);animation-delay:calc(var(--sci-throbber-duration) * .5833333333)}:host>div.stroke:nth-child(8){transform:rotate(210deg);animation-delay:calc(var(--sci-throbber-duration) * .6666666667)}:host>div.stroke:nth-child(9){transform:rotate(240deg);animation-delay:calc(var(--sci-throbber-duration) * .75)}:host>div.stroke:nth-child(10){transform:rotate(270deg);animation-delay:calc(var(--sci-throbber-duration) * .8333333333)}:host>div.stroke:nth-child(11){transform:rotate(300deg);animation-delay:calc(var(--sci-throbber-duration) * .9166666667)}:host>div.stroke:nth-child(12){transform:rotate(330deg);animation-delay:calc(var(--sci-throbber-duration) * 1)}@keyframes sci-spinner-throbber{0%{opacity:1}to{opacity:0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciSpinnerThrobberComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciSpinnerThrobberComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sci-spinner-throbber', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>", styles: ["@charset \"UTF-8\";:host{display:inline-flex;justify-content:center;position:relative;font-size:var(--\\275sci-throbber-size);width:1em;height:1em;box-sizing:border-box}:host>div.stroke{flex:none;position:absolute;transform-origin:.0375em .5em;width:.075em;height:.25em;opacity:0;border-radius:20%;background-color:var(--\\275sci-throbber-color);animation:sci-spinner-throbber var(--\\275sci-throbber-duration) linear infinite}:host>div.stroke:nth-child(1){transform:rotate(0);animation-delay:calc(var(--\\275sci-throbber-duration) * .0833333333)}:host>div.stroke:nth-child(2){transform:rotate(30deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .1666666667)}:host>div.stroke:nth-child(3){transform:rotate(60deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .25)}:host>div.stroke:nth-child(4){transform:rotate(90deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .3333333333)}:host>div.stroke:nth-child(5){transform:rotate(120deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .4166666667)}:host>div.stroke:nth-child(6){transform:rotate(150deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .5)}:host>div.stroke:nth-child(7){transform:rotate(180deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .5833333333)}:host>div.stroke:nth-child(8){transform:rotate(210deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .6666666667)}:host>div.stroke:nth-child(9){transform:rotate(240deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .75)}:host>div.stroke:nth-child(10){transform:rotate(270deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .8333333333)}:host>div.stroke:nth-child(11){transform:rotate(300deg);animation-delay:calc(var(--\\275sci-throbber-duration) * .9166666667)}:host>div.stroke:nth-child(12){transform:rotate(330deg);animation-delay:calc(var(--\\275sci-throbber-duration) * 1)}@keyframes sci-spinner-throbber{0%{opacity:1}to{opacity:0}}\n"] }]
+            args: [{ selector: 'sci-spinner-throbber', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>", styles: [":host{display:inline-flex;justify-content:center;position:relative;font-size:var(--sci-throbber-size);width:1em;height:1em;box-sizing:border-box}:host>div.stroke{flex:none;position:absolute;transform-origin:.0375em .5em;width:.075em;height:.25em;opacity:0;border-radius:20%;background-color:var(--sci-throbber-color);animation:sci-spinner-throbber var(--sci-throbber-duration) linear infinite}:host>div.stroke:nth-child(1){transform:rotate(0);animation-delay:calc(var(--sci-throbber-duration) * .0833333333)}:host>div.stroke:nth-child(2){transform:rotate(30deg);animation-delay:calc(var(--sci-throbber-duration) * .1666666667)}:host>div.stroke:nth-child(3){transform:rotate(60deg);animation-delay:calc(var(--sci-throbber-duration) * .25)}:host>div.stroke:nth-child(4){transform:rotate(90deg);animation-delay:calc(var(--sci-throbber-duration) * .3333333333)}:host>div.stroke:nth-child(5){transform:rotate(120deg);animation-delay:calc(var(--sci-throbber-duration) * .4166666667)}:host>div.stroke:nth-child(6){transform:rotate(150deg);animation-delay:calc(var(--sci-throbber-duration) * .5)}:host>div.stroke:nth-child(7){transform:rotate(180deg);animation-delay:calc(var(--sci-throbber-duration) * .5833333333)}:host>div.stroke:nth-child(8){transform:rotate(210deg);animation-delay:calc(var(--sci-throbber-duration) * .6666666667)}:host>div.stroke:nth-child(9){transform:rotate(240deg);animation-delay:calc(var(--sci-throbber-duration) * .75)}:host>div.stroke:nth-child(10){transform:rotate(270deg);animation-delay:calc(var(--sci-throbber-duration) * .8333333333)}:host>div.stroke:nth-child(11){transform:rotate(300deg);animation-delay:calc(var(--sci-throbber-duration) * .9166666667)}:host>div.stroke:nth-child(12){transform:rotate(330deg);animation-delay:calc(var(--sci-throbber-duration) * 1)}@keyframes sci-spinner-throbber{0%{opacity:1}to{opacity:0}}\n"] }]
         }] });
 /*
@@ -146,10 +146,10 @@ class SciThrobberComponent {
          */
         this.type = 'spinner';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciThrobberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.2", type: SciThrobberComponent, isStandalone: true, selector: "sci-throbber", inputs: { type: "type" }, ngImport: i0, template: "<ng-container [ngSwitch]=\"type\">\n  <sci-ellipsis-throbber *ngSwitchCase=\"'ellipsis'\"></sci-ellipsis-throbber>\n  <sci-ripple-throbber *ngSwitchCase=\"'ripple'\"></sci-ripple-throbber>\n  <sci-roller-throbber *ngSwitchCase=\"'roller'\"></sci-roller-throbber>\n  <sci-spinner-throbber *ngSwitchCase=\"'spinner'\"></sci-spinner-throbber>\n  <sci-spinner-throbber *ngSwitchDefault></sci-spinner-throbber>\n</ng-container>", styles: ["@charset \"UTF-8\";:host{display:inline-grid;--\\275sci-throbber-color: var(--sci-throbber-color, lightgray);--\\275sci-throbber-size: var(--sci-throbber-size, 50px);--\\275sci-throbber-duration: var(--sci-throbber-duration, 1.25s)}\n"], dependencies: [{ kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: SciEllipsisThrobberComponent, selector: "sci-ellipsis-throbber" }, { kind: "component", type: SciRippleThrobberComponent, selector: "sci-ripple-throbber" }, { kind: "component", type: SciRollerThrobberComponent, selector: "sci-roller-throbber" }, { kind: "component", type: SciSpinnerThrobberComponent, selector: "sci-spinner-throbber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciThrobberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.1", type: SciThrobberComponent, isStandalone: true, selector: "sci-throbber", inputs: { type: "type" }, ngImport: i0, template: "<ng-container [ngSwitch]=\"type\">\n  <sci-ellipsis-throbber *ngSwitchCase=\"'ellipsis'\"></sci-ellipsis-throbber>\n  <sci-ripple-throbber *ngSwitchCase=\"'ripple'\"></sci-ripple-throbber>\n  <sci-roller-throbber *ngSwitchCase=\"'roller'\"></sci-roller-throbber>\n  <sci-spinner-throbber *ngSwitchCase=\"'spinner'\"></sci-spinner-throbber>\n  <sci-spinner-throbber *ngSwitchDefault></sci-spinner-throbber>\n</ng-container>", styles: [":host{display:inline-grid}\n"], dependencies: [{ kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: SciEllipsisThrobberComponent, selector: "sci-ellipsis-throbber" }, { kind: "component", type: SciRippleThrobberComponent, selector: "sci-ripple-throbber" }, { kind: "component", type: SciRollerThrobberComponent, selector: "sci-roller-throbber" }, { kind: "component", type: SciSpinnerThrobberComponent, selector: "sci-spinner-throbber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciThrobberComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciThrobberComponent, decorators: [{
             type: Component,
             args: [{ selector: 'sci-throbber', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
                         NgSwitch,
@@ -159,7 +159,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImpor
                         SciRippleThrobberComponent,
                         SciRollerThrobberComponent,
                         SciSpinnerThrobberComponent,
-                    ], template: "<ng-container [ngSwitch]=\"type\">\n  <sci-ellipsis-throbber *ngSwitchCase=\"'ellipsis'\"></sci-ellipsis-throbber>\n  <sci-ripple-throbber *ngSwitchCase=\"'ripple'\"></sci-ripple-throbber>\n  <sci-roller-throbber *ngSwitchCase=\"'roller'\"></sci-roller-throbber>\n  <sci-spinner-throbber *ngSwitchCase=\"'spinner'\"></sci-spinner-throbber>\n  <sci-spinner-throbber *ngSwitchDefault></sci-spinner-throbber>\n</ng-container>", styles: ["@charset \"UTF-8\";:host{display:inline-grid;--\\275sci-throbber-color: var(--sci-throbber-color, lightgray);--\\275sci-throbber-size: var(--sci-throbber-size, 50px);--\\275sci-throbber-duration: var(--sci-throbber-duration, 1.25s)}\n"] }]
+                    ], template: "<ng-container [ngSwitch]=\"type\">\n  <sci-ellipsis-throbber *ngSwitchCase=\"'ellipsis'\"></sci-ellipsis-throbber>\n  <sci-ripple-throbber *ngSwitchCase=\"'ripple'\"></sci-ripple-throbber>\n  <sci-roller-throbber *ngSwitchCase=\"'roller'\"></sci-roller-throbber>\n  <sci-spinner-throbber *ngSwitchCase=\"'spinner'\"></sci-spinner-throbber>\n  <sci-spinner-throbber *ngSwitchDefault></sci-spinner-throbber>\n</ng-container>", styles: [":host{display:inline-grid}\n"] }]
         }], propDecorators: { type: [{
                 type: Input
             }] } });
@@ -177,11 +177,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImpor
  * Provides {@link SciThrobberComponent}, an animated graphical control to indicate the execution of an action.
  */
 class SciThrobberModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciThrobberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.2", ngImport: i0, type: SciThrobberModule, imports: [SciThrobberComponent], exports: [SciThrobberComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciThrobberModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciThrobberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.1", ngImport: i0, type: SciThrobberModule, imports: [SciThrobberComponent], exports: [SciThrobberComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciThrobberModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciThrobberModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciThrobberModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/fesm2022/scion-components-throbber.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"scion-components-throbber.mjs","sources":["../../../../projects/scion/components/throbber/src/ellipsis-throbber/ellipsis-throbber.component.ts","../../../../projects/scion/components/throbber/src/ellipsis-throbber/ellipsis-throbber.component.html","../../../../projects/scion/components/throbber/src/ripple-throbber/ripple-throbber.component.ts","../../../../projects/scion/components/throbber/src/ripple-throbber/ripple-throbber.component.html","../../../../projects/scion/components/throbber/src/roller-throbber/roller-throbber.component.ts","../../../../projects/scion/components/throbber/src/roller-throbber/roller-throbber.component.html","../../../../projects/scion/components/throbber/src/spinner-throbber/spinner-throbber.component.ts","../../../../projects/scion/components/throbber/src/spinner-throbber/spinner-throbber.component.html","../../../../projects/scion/components/throbber/src/throbber.component.ts","../../../../projects/scion/components/throbber/src/throbber.component.html","../../../../projects/scion/components/throbber/src/throbber.module.ts","../../../../projects/scion/components/throbber/src/public_api.ts","../../../../projects/scion/components/throbber/src/scion-components-throbber.ts"],"sourcesContent":["/\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 {ChangeDetectionStrategy, Component} from '@angular/core';\n\n/\n Represents a throbber as an ellipsis consisting of three horizontally arranged points that appear one after the other.\n \n Throbber type: `ellipsis`\n /\n@Component({\n selector: 'sci-ellipsis-throbber',\n templateUrl: './ellipsis-throbber.component.html',\n styleUrls: ['./ellipsis-throbber.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n})\nexport class SciEllipsisThrobberComponent {\n}\n","<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\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 {ChangeDetectionStrategy, Component} from '@angular/core';\n\n/\n Represents a throbber with a rippled, centric wave effect, similar to throwing a stone into water.\n \n Throbber type: `ripple`\n /\n@Component({\n selector: 'sci-ripple-throbber',\n templateUrl: './ripple-throbber.component.html',\n styleUrls: ['./ripple-throbber.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n})\nexport class SciRippleThrobberComponent {\n}\n","<div class=\"circle\"></div>\n<div class=\"circle\"></div>\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 {ChangeDetectionStrategy, Component} from '@angular/core';\n\n/\n Represents a circular throbber with points rotating around the center of a circle. Points have a delayed acceleration, which leads to an accordion effect.\n \n Throbber type: `roller`\n /\n@Component({\n selector: 'sci-roller-throbber',\n templateUrl: './roller-throbber.component.html',\n styleUrls: ['./roller-throbber.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n})\nexport class SciRollerThrobberComponent {\n}\n","<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>","/\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 {ChangeDetectionStrategy, Component} from '@angular/core';\n\n/\n Represents a classic spinner throbber with strokes arranged radially. The strokes light up one after the other in clockwise direction\n * and then then fade out again.\n \n Throbber type: `spinner`\n /\n@Component({\n selector: 'sci-spinner-throbber',\n templateUrl: './spinner-throbber.component.html',\n styleUrls: ['./spinner-throbber.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n})\nexport class SciSpinnerThrobberComponent {\n}\n","<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>","/\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 {ChangeDetectionStrategy, Component, Input} from '@angular/core';\nimport {NgSwitch, NgSwitchCase, NgSwitchDefault} from '@angular/common';\nimport {SciEllipsisThrobberComponent} from './ellipsis-throbber/ellipsis-throbber.component';\nimport {SciRippleThrobberComponent} from './ripple-throbber/ripple-throbber.component';\nimport {SciRollerThrobberComponent} from './roller-throbber/roller-throbber.component';\nimport {SciSpinnerThrobberComponent} from './spinner-throbber/spinner-throbber.component';\n\n/\n Animated graphical control to indicate the execution of an action.\n \n Choose between different throbber presentations by setting the `type` property: `ellipsis`, `ripple`, `roller`, `spinner`.\n \n ### Styling:\n \n To customize the default look of SCION components or support different themes, configure the `@scion/components` SCSS module in `styles.scss`.\n * To style a specific `sci-throbber` component, the following CSS variables can be set directly on the component.\n \n - sci-throbber-color: Sets the color of the throbber (by default, uses `lightgray`).\n * - sci-throbber-size: Defines the size of the throbber. Most throbbers are quadratic having the same width and height.\n * For non-quadratic throbbers, the size usually specifies the height (by default, uses `50px`).\n * - sci-throbber-duration: Sets the duration of a single animation cycle (by default, uses `1.25s`).\n \n Example:\n \n ```css\n \n sci-throbber {\n * --sci-throbber-color: blue;\n * --sci-throbber-size: 50px;\n * --sci-throbber-duration: 1s\n * }\n * ```\n /\n@Component({\n selector: 'sci-throbber',\n templateUrl: './throbber.component.html',\n styleUrls: ['./throbber.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n imports: [\n NgSwitch,\n NgSwitchCase,\n NgSwitchDefault,\n SciEllipsisThrobberComponent,\n SciRippleThrobberComponent,\n SciRollerThrobberComponent,\n SciSpinnerThrobberComponent,\n ],\n})\nexport class SciThrobberComponent {\n\n /\n Chooses between different throbber presentation. If not set, uses `spinner` type.\n \n - ellipsis\n * Represents a throbber as an ellipsis consisting of three horizontally arranged points that appear one after the other.\n * - ripple\n * Represents a throbber with a rippled, centric wave effect, similar to throwing a stone into water.\n * - roller\n * Represents a circular throbber with points rotating around the center of a circle. Points have a delayed acceleration, which leads to an accordion effect.\n * - spinner (default)\n * Represents a classic spinner throbber with strokes arranged radially. The strokes light up one after the other in clockwise direction and then then fade out again.\n /\n @Input()\n public type: 'ellipsis' \| 'ripple' \| 'roller' \| 'spinner' = 'spinner';\n}\n","<ng-container [ngSwitch]=\"type\">\n <sci-ellipsis-throbber ngSwitchCase=\"'ellipsis'\"></sci-ellipsis-throbber>\n <sci-ripple-throbber ngSwitchCase=\"'ripple'\"></sci-ripple-throbber>\n <sci-roller-throbber ngSwitchCase=\"'roller'\"></sci-roller-throbber>\n <sci-spinner-throbber ngSwitchCase=\"'spinner'\"></sci-spinner-throbber>\n <sci-spinner-throbber ngSwitchDefault></sci-spinner-throbber>\n</ng-container>","/\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 {SciThrobberComponent} from './throbber.component';\n\n/\n Provides {@link SciThrobberComponent}, an animated graphical control to indicate the execution of an action.\n /\n@NgModule({\n imports: [\n SciThrobberComponent,\n ],\n exports: [\n SciThrobberComponent,\n ],\n})\nexport class SciThrobberModule {\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/throbber'\n \n @see https://github.com/ng-packagr/ng-packagr/blob/master/docs/secondary-entrypoints.md\n /\nexport {SciThrobberModule} from './throbber.module';\nexport {SciThrobberComponent} from './throbber.component';\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-throbber.mjs","sources":["../../../../projects/scion/components/throbber/src/ellipsis-throbber/ellipsis-throbber.component.ts","../../../../projects/scion/components/throbber/src/ellipsis-throbber/ellipsis-throbber.component.html","../../../../projects/scion/components/throbber/src/ripple-throbber/ripple-throbber.component.ts","../../../../projects/scion/components/throbber/src/ripple-throbber/ripple-throbber.component.html","../../../../projects/scion/components/throbber/src/roller-throbber/roller-throbber.component.ts","../../../../projects/scion/components/throbber/src/roller-throbber/roller-throbber.component.html","../../../../projects/scion/components/throbber/src/spinner-throbber/spinner-throbber.component.ts","../../../../projects/scion/components/throbber/src/spinner-throbber/spinner-throbber.component.html","../../../../projects/scion/components/throbber/src/throbber.component.ts","../../../../projects/scion/components/throbber/src/throbber.component.html","../../../../projects/scion/components/throbber/src/throbber.module.ts","../../../../projects/scion/components/throbber/src/public_api.ts","../../../../projects/scion/components/throbber/src/scion-components-throbber.ts"],"sourcesContent":["/\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 {ChangeDetectionStrategy, Component} from '@angular/core';\n\n/\n Represents a throbber as an ellipsis consisting of three horizontally arranged points that appear one after the other.\n \n Throbber type: `ellipsis`\n /\n@Component({\n selector: 'sci-ellipsis-throbber',\n templateUrl: './ellipsis-throbber.component.html',\n styleUrls: ['./ellipsis-throbber.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n})\nexport class SciEllipsisThrobberComponent {\n}\n","<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\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 {ChangeDetectionStrategy, Component} from '@angular/core';\n\n/\n Represents a throbber with a rippled, centric wave effect, similar to throwing a stone into water.\n \n Throbber type: `ripple`\n /\n@Component({\n selector: 'sci-ripple-throbber',\n templateUrl: './ripple-throbber.component.html',\n styleUrls: ['./ripple-throbber.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n})\nexport class SciRippleThrobberComponent {\n}\n","<div class=\"circle\"></div>\n<div class=\"circle\"></div>\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 {ChangeDetectionStrategy, Component} from '@angular/core';\n\n/\n Represents a circular throbber with points rotating around the center of a circle. Points have a delayed acceleration, which leads to an accordion effect.\n \n Throbber type: `roller`\n /\n@Component({\n selector: 'sci-roller-throbber',\n templateUrl: './roller-throbber.component.html',\n styleUrls: ['./roller-throbber.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n})\nexport class SciRollerThrobberComponent {\n}\n","<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>\n<div class=\"point\"></div>","/\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 {ChangeDetectionStrategy, Component} from '@angular/core';\n\n/\n Represents a classic spinner throbber with strokes arranged radially. The strokes light up one after the other in clockwise direction\n * and then then fade out again.\n \n Throbber type: `spinner`\n /\n@Component({\n selector: 'sci-spinner-throbber',\n templateUrl: './spinner-throbber.component.html',\n styleUrls: ['./spinner-throbber.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n})\nexport class SciSpinnerThrobberComponent {\n}\n","<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>\n<div class=\"stroke\"></div>","/\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 {ChangeDetectionStrategy, Component, Input} from '@angular/core';\nimport {NgSwitch, NgSwitchCase, NgSwitchDefault} from '@angular/common';\nimport {SciEllipsisThrobberComponent} from './ellipsis-throbber/ellipsis-throbber.component';\nimport {SciRippleThrobberComponent} from './ripple-throbber/ripple-throbber.component';\nimport {SciRollerThrobberComponent} from './roller-throbber/roller-throbber.component';\nimport {SciSpinnerThrobberComponent} from './spinner-throbber/spinner-throbber.component';\n\n/\n Animated graphical control to indicate the execution of an action.\n \n Choose between different throbber presentations by setting the `type` property: `ellipsis`, `ripple`, `roller`, `spinner`.\n \n ### Styling:\n \n To customize the default look of SCION components or support different themes, configure the `@scion/components` SCSS module in `styles.scss`.\n * To style a specific `sci-throbber` component, the following CSS variables can be set directly on the component.\n \n - sci-throbber-color: Sets the color of the throbber (by default, uses `lightgray`).\n * - sci-throbber-size: Defines the size of the throbber. Most throbbers are quadratic having the same width and height.\n * For non-quadratic throbbers, the size usually specifies the height (by default, uses `50px`).\n * - sci-throbber-duration: Sets the duration of a single animation cycle (by default, uses `1.25s`).\n \n Example:\n \n ```css\n \n sci-throbber {\n * --sci-throbber-color: blue;\n * --sci-throbber-size: 50px;\n * --sci-throbber-duration: 1s\n * }\n * ```\n /\n@Component({\n selector: 'sci-throbber',\n templateUrl: './throbber.component.html',\n styleUrls: ['./throbber.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n imports: [\n NgSwitch,\n NgSwitchCase,\n NgSwitchDefault,\n SciEllipsisThrobberComponent,\n SciRippleThrobberComponent,\n SciRollerThrobberComponent,\n SciSpinnerThrobberComponent,\n ],\n})\nexport class SciThrobberComponent {\n\n /\n Chooses between different throbber presentation. If not set, uses `spinner` type.\n \n - ellipsis\n * Represents a throbber as an ellipsis consisting of three horizontally arranged points that appear one after the other.\n * - ripple\n * Represents a throbber with a rippled, centric wave effect, similar to throwing a stone into water.\n * - roller\n * Represents a circular throbber with points rotating around the center of a circle. Points have a delayed acceleration, which leads to an accordion effect.\n * - spinner (default)\n * Represents a classic spinner throbber with strokes arranged radially. The strokes light up one after the other in clockwise direction and then then fade out again.\n /\n @Input()\n public type: 'ellipsis' \| 'ripple' \| 'roller' \| 'spinner' = 'spinner';\n}\n","<ng-container [ngSwitch]=\"type\">\n <sci-ellipsis-throbber ngSwitchCase=\"'ellipsis'\"></sci-ellipsis-throbber>\n <sci-ripple-throbber ngSwitchCase=\"'ripple'\"></sci-ripple-throbber>\n <sci-roller-throbber ngSwitchCase=\"'roller'\"></sci-roller-throbber>\n <sci-spinner-throbber ngSwitchCase=\"'spinner'\"></sci-spinner-throbber>\n <sci-spinner-throbber ngSwitchDefault></sci-spinner-throbber>\n</ng-container>","/\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 {SciThrobberComponent} from './throbber.component';\n\n/\n Provides {@link SciThrobberComponent}, an animated graphical control to indicate the execution of an action.\n /\n@NgModule({\n imports: [\n SciThrobberComponent,\n ],\n exports: [\n SciThrobberComponent,\n ],\n})\nexport class SciThrobberModule {\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/throbber'\n \n @see https://github.com/ng-packagr/ng-packagr/blob/master/docs/secondary-entrypoints.md\n /\nexport {SciThrobberModule} from './throbber.module';\nexport {SciThrobberComponent} from './throbber.component';\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public_api';\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;AAQG;AAIH;;;;AAIG;MAQU,4BAA4B,CAAA;8GAA5B,4BAA4B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAA5B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,4BAA4B,iFCxBzC,yFAGA,EAAA,MAAA,EAAA,CAAA,mlBAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FDqBa,4BAA4B,EAAA,UAAA,EAAA,CAAA;kBAPxC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,uBAAuB,EAGhB,eAAA,EAAA,uBAAuB,CAAC,MAAM,cACnC,IAAI,EAAA,QAAA,EAAA,yFAAA,EAAA,MAAA,EAAA,CAAA,mlBAAA,CAAA,EAAA,CAAA;;;AEtBlB;;;;;;;;AAQG;AAIH;;;;AAIG;MAQU,0BAA0B,CAAA;8GAA1B,0BAA0B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAA1B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,0BAA0B,+ECxBvC,8DAEA,EAAA,MAAA,EAAA,CAAA,slBAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FDsBa,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBAPtC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,qBAAqB,EAGd,eAAA,EAAA,uBAAuB,CAAC,MAAM,cACnC,IAAI,EAAA,QAAA,EAAA,8DAAA,EAAA,MAAA,EAAA,CAAA,slBAAA,CAAA,EAAA,CAAA;;;AEtBlB;;;;;;;;AAQG;AAIH;;;;AAIG;MAQU,0BAA0B,CAAA;8GAA1B,0BAA0B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAA1B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,0BAA0B,+ECxBvC,wOAOyB,EAAA,MAAA,EAAA,CAAA,o6EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FDiBZ,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBAPtC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,qBAAqB,EAGd,eAAA,EAAA,uBAAuB,CAAC,MAAM,cACnC,IAAI,EAAA,QAAA,EAAA,wOAAA,EAAA,MAAA,EAAA,CAAA,o6EAAA,CAAA,EAAA,CAAA;;;AEtBlB;;;;;;;;AAQG;AAIH;;;;;AAKG;MAQU,2BAA2B,CAAA;8GAA3B,2BAA2B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAA3B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,2BAA2B,gFCzBxC,wWAW0B,EAAA,MAAA,EAAA,CAAA,g0DAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FDcb,2BAA2B,EAAA,UAAA,EAAA,CAAA;kBAPvC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,sBAAsB,EAGf,eAAA,EAAA,uBAAuB,CAAC,MAAM,cACnC,IAAI,EAAA,QAAA,EAAA,wWAAA,EAAA,MAAA,EAAA,CAAA,g0DAAA,CAAA,EAAA,CAAA;;;AEvBlB;;;;;;;;AAQG;AASH;;;;;;;;;;;;;;;;;;;;;;;;;AAyBG;MAiBU,oBAAoB,CAAA;AAhBjC,IAAA,WAAA,GAAA;AAkBE;;;;;;;;;;;AAWG;QAEI,IAAI,CAAA,IAAA,GAAiD,SAAS,CAAC;AACvE,KAAA;8GAhBY,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,EC3DjC,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,waAMe,ED4CX,MAAA,EAAA,CAAA,8BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAQ,6EACR,YAAY,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,cAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACZ,eAAe,EAAA,QAAA,EAAA,mBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACf,4BAA4B,EAC5B,QAAA,EAAA,uBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,0BAA0B,EAC1B,QAAA,EAAA,qBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,0BAA0B,gEAC1B,2BAA2B,EAAA,QAAA,EAAA,sBAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FAGlB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAhBhC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,cAAc,mBAGP,uBAAuB,CAAC,MAAM,EAAA,UAAA,EACnC,IAAI,EACP,OAAA,EAAA;wBACP,QAAQ;wBACR,YAAY;wBACZ,eAAe;wBACf,4BAA4B;wBAC5B,0BAA0B;wBAC1B,0BAA0B;wBAC1B,2BAA2B;AAC5B,qBAAA,EAAA,QAAA,EAAA,waAAA,EAAA,MAAA,EAAA,CAAA,8BAAA,CAAA,EAAA,CAAA;8BAiBM,IAAI,EAAA,CAAA;sBADV,KAAK;;;AEzER;;;;;;;;AAQG;AAKH;;AAEG;MASU,iBAAiB,CAAA;8GAAjB,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;+GAAjB,iBAAiB,EAAA,OAAA,EAAA,CAN1B,oBAAoB,CAAA,EAAA,OAAA,EAAA,CAGpB,oBAAoB,CAAA,EAAA,CAAA,CAAA,EAAA;+GAGX,iBAAiB,EAAA,CAAA,CAAA,EAAA;;2FAAjB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAR7B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE;wBACP,oBAAoB;AACrB,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,oBAAoB;AACrB,qBAAA;AACF,iBAAA,CAAA;;;ACvBD;;;;;;;;AAQG;AAEH;;;;AAIG;;ACdH;;AAEG;;;;"}

package/fesm2022/scion-components-viewport.mjs CHANGED Viewed

@@ -97,10 +97,10 @@ class SciNativeScrollbarTrackSizeProvider {
     ngOnDestroy() {
         this._destroy$.next();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciNativeScrollbarTrackSizeProvider, deps: [{ token: DOCUMENT }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciNativeScrollbarTrackSizeProvider, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciNativeScrollbarTrackSizeProvider, deps: [{ token: DOCUMENT }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciNativeScrollbarTrackSizeProvider, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciNativeScrollbarTrackSizeProvider, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciNativeScrollbarTrackSizeProvider, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: Document, decorators: [{
@@ -194,10 +194,10 @@ class SciScrollableDirective {
     ngOnDestroy() {
         this._destroy$.next();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciScrollableDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: SciNativeScrollbarTrackSizeProvider }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.2", type: SciScrollableDirective, isStandalone: true, selector: "[sciScrollable]", inputs: { isDisplayNativeScrollbar: ["sciScrollableDisplayNativeScrollbar", "isDisplayNativeScrollbar"] }, usesOnChanges: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciScrollableDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: SciNativeScrollbarTrackSizeProvider }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.1", type: SciScrollableDirective, isStandalone: true, selector: "[sciScrollable]", inputs: { isDisplayNativeScrollbar: ["sciScrollableDisplayNativeScrollbar", "isDisplayNativeScrollbar"] }, usesOnChanges: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciScrollableDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciScrollableDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[sciScrollable]',
@@ -496,12 +496,12 @@ class SciScrollbarComponent {
     ngOnDestroy() {
         this._destroy$.next();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciScrollbarComponent, deps: [{ token: i0.ElementRef }, { token: DOCUMENT }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.2", type: SciScrollbarComponent, isStandalone: true, selector: "sci-scrollbar", inputs: { direction: "direction", setViewport: ["viewport", "setViewport"] }, host: { properties: { "class.vertical": "this.vertical", "class.horizontal": "this.horizontal", "class.scrolling": "this.scrolling" } }, viewQueries: [{ propertyName: "thumbElement", first: true, predicate: ["thumb_handle"], descendants: true, static: true }], ngImport: i0, template: "<!-- scrolltrack to move the viewport client upwards (paging) -->\n<div class=\"scrolltrack-start\" (mousedown)=\"onScrollTrackMouseDown($event, 'up')\"></div>\n\n<!-- scrollthumb -->\n<div #thumb_handle\n     class=\"thumb-handle\"\n     [class.vertical]=\"vertical\"\n     [class.horizontal]=\"horizontal\"\n     (mousedown)=\"onMouseDown($event)\"\n     (touchstart)=\"onTouchStart($event)\"\n     (touchmove)=\"onTouchMove($event)\"\n     (touchend)=\"onTouchEnd($event)\"\n     (touchcancel)=\"onTouchEnd($event)\">\n  <div class=\"thumb\"\n       [class.vertical]=\"vertical\"\n       [class.horizontal]=\"horizontal\">\n  </div>\n</div>\n\n<!-- scrolltrack to move the viewport client downwards (paging) -->\n<div class=\"scrolltrack-end\" (mousedown)=\"onScrollTrackMouseDown($event, 'down')\"></div>\n", styles: ["@charset \"UTF-8\";:host{display:flex;border:2px solid transparent;box-sizing:border-box;--\\275sci-scrollbar-color: var(--sci-scrollbar-color, rgb(78, 78, 78));--\\275sci-scrollbar-thumb-position-fr: 0;--\\275sci-scrollbar-thumb-size-fr: 0}:host.vertical{flex-direction:column}:host.horizontal{flex-direction:row}:host>div.scrolltrack-start{flex-grow:var(--\\275sci-scrollbar-thumb-position-fr)}:host>div.thumb-handle{flex-basis:20px;display:flex;flex-grow:var(--\\275sci-scrollbar-thumb-size-fr);align-items:center}:host>div.thumb-handle.vertical{flex-direction:column}:host>div.thumb-handle.horizontal{flex-direction:row}:host>div.thumb-handle>div.thumb{flex:auto;border-radius:4px;background-color:var(--\\275sci-scrollbar-color);opacity:.4;transition-duration:125ms;transition-property:width,height;transition-timing-function:ease-out}:host>div.thumb-handle>div.thumb.vertical{width:60%}:host>div.thumb-handle>div.thumb.horizontal{height:60%}:host>div.scrolltrack-end{flex-grow:calc(1 - (var(--\\275sci-scrollbar-thumb-position-fr) + var(--\\275sci-scrollbar-thumb-size-fr)))}:host-context:not(.overflow){display:none}:host-context:hover>div.thumb-handle>div.thumb,:host-context(.scrolling)>div.thumb-handle>div.thumb{background-color:var(--\\275sci-scrollbar-color);opacity:.75}:host-context:hover>div.thumb-handle>div.thumb.vertical,:host-context(.scrolling)>div.thumb-handle>div.thumb.vertical{width:100%}:host-context:hover>div.thumb-handle>div.thumb.horizontal,:host-context(.scrolling)>div.thumb-handle>div.thumb.horizontal{height:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciScrollbarComponent, deps: [{ token: i0.ElementRef }, { token: DOCUMENT }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.1", type: SciScrollbarComponent, isStandalone: true, selector: "sci-scrollbar", inputs: { direction: "direction", setViewport: ["viewport", "setViewport"] }, host: { properties: { "class.vertical": "this.vertical", "class.horizontal": "this.horizontal", "class.scrolling": "this.scrolling" } }, viewQueries: [{ propertyName: "thumbElement", first: true, predicate: ["thumb_handle"], descendants: true, static: true }], ngImport: i0, template: "<!-- scrolltrack to move the viewport client upwards (paging) -->\n<div class=\"scrolltrack-start\" (mousedown)=\"onScrollTrackMouseDown($event, 'up')\"></div>\n\n<!-- scrollthumb -->\n<div #thumb_handle\n     class=\"thumb-handle\"\n     [class.vertical]=\"vertical\"\n     [class.horizontal]=\"horizontal\"\n     (mousedown)=\"onMouseDown($event)\"\n     (touchstart)=\"onTouchStart($event)\"\n     (touchmove)=\"onTouchMove($event)\"\n     (touchend)=\"onTouchEnd($event)\"\n     (touchcancel)=\"onTouchEnd($event)\">\n  <div class=\"thumb\"\n       [class.vertical]=\"vertical\"\n       [class.horizontal]=\"horizontal\">\n  </div>\n</div>\n\n<!-- scrolltrack to move the viewport client downwards (paging) -->\n<div class=\"scrolltrack-end\" (mousedown)=\"onScrollTrackMouseDown($event, 'down')\"></div>\n", styles: ["@charset \"UTF-8\";:host{display:flex;border:2px solid transparent;box-sizing:border-box;--\\275sci-scrollbar-thumb-position-fr: 0;--\\275sci-scrollbar-thumb-size-fr: 0}:host.vertical{flex-direction:column}:host.horizontal{flex-direction:row}:host>div.scrolltrack-start{flex-grow:var(--\\275sci-scrollbar-thumb-position-fr)}:host>div.thumb-handle{flex-basis:20px;display:flex;flex-grow:var(--\\275sci-scrollbar-thumb-size-fr);align-items:center}:host>div.thumb-handle.vertical{flex-direction:column}:host>div.thumb-handle.horizontal{flex-direction:row}:host>div.thumb-handle>div.thumb{flex:auto;border-radius:4px;background-color:var(--sci-scrollbar-color);opacity:.4;transition-duration:125ms;transition-property:width,height;transition-timing-function:ease-out}:host>div.thumb-handle>div.thumb.vertical{width:60%}:host>div.thumb-handle>div.thumb.horizontal{height:60%}:host>div.scrolltrack-end{flex-grow:calc(1 - (var(--\\275sci-scrollbar-thumb-position-fr) + var(--\\275sci-scrollbar-thumb-size-fr)))}:host-context:not(.overflow){display:none}:host-context:hover>div.thumb-handle>div.thumb,:host-context(.scrolling)>div.thumb-handle>div.thumb{background-color:var(--sci-scrollbar-color);opacity:.75}:host-context:hover>div.thumb-handle>div.thumb.vertical,:host-context(.scrolling)>div.thumb-handle>div.thumb.vertical{width:100%}:host-context:hover>div.thumb-handle>div.thumb.horizontal,:host-context(.scrolling)>div.thumb-handle>div.thumb.horizontal{height:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciScrollbarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciScrollbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sci-scrollbar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<!-- scrolltrack to move the viewport client upwards (paging) -->\n<div class=\"scrolltrack-start\" (mousedown)=\"onScrollTrackMouseDown($event, 'up')\"></div>\n\n<!-- scrollthumb -->\n<div #thumb_handle\n     class=\"thumb-handle\"\n     [class.vertical]=\"vertical\"\n     [class.horizontal]=\"horizontal\"\n     (mousedown)=\"onMouseDown($event)\"\n     (touchstart)=\"onTouchStart($event)\"\n     (touchmove)=\"onTouchMove($event)\"\n     (touchend)=\"onTouchEnd($event)\"\n     (touchcancel)=\"onTouchEnd($event)\">\n  <div class=\"thumb\"\n       [class.vertical]=\"vertical\"\n       [class.horizontal]=\"horizontal\">\n  </div>\n</div>\n\n<!-- scrolltrack to move the viewport client downwards (paging) -->\n<div class=\"scrolltrack-end\" (mousedown)=\"onScrollTrackMouseDown($event, 'down')\"></div>\n", styles: ["@charset \"UTF-8\";:host{display:flex;border:2px solid transparent;box-sizing:border-box;--\\275sci-scrollbar-color: var(--sci-scrollbar-color, rgb(78, 78, 78));--\\275sci-scrollbar-thumb-position-fr: 0;--\\275sci-scrollbar-thumb-size-fr: 0}:host.vertical{flex-direction:column}:host.horizontal{flex-direction:row}:host>div.scrolltrack-start{flex-grow:var(--\\275sci-scrollbar-thumb-position-fr)}:host>div.thumb-handle{flex-basis:20px;display:flex;flex-grow:var(--\\275sci-scrollbar-thumb-size-fr);align-items:center}:host>div.thumb-handle.vertical{flex-direction:column}:host>div.thumb-handle.horizontal{flex-direction:row}:host>div.thumb-handle>div.thumb{flex:auto;border-radius:4px;background-color:var(--\\275sci-scrollbar-color);opacity:.4;transition-duration:125ms;transition-property:width,height;transition-timing-function:ease-out}:host>div.thumb-handle>div.thumb.vertical{width:60%}:host>div.thumb-handle>div.thumb.horizontal{height:60%}:host>div.scrolltrack-end{flex-grow:calc(1 - (var(--\\275sci-scrollbar-thumb-position-fr) + var(--\\275sci-scrollbar-thumb-size-fr)))}:host-context:not(.overflow){display:none}:host-context:hover>div.thumb-handle>div.thumb,:host-context(.scrolling)>div.thumb-handle>div.thumb{background-color:var(--\\275sci-scrollbar-color);opacity:.75}:host-context:hover>div.thumb-handle>div.thumb.vertical,:host-context(.scrolling)>div.thumb-handle>div.thumb.vertical{width:100%}:host-context:hover>div.thumb-handle>div.thumb.horizontal,:host-context(.scrolling)>div.thumb-handle>div.thumb.horizontal{height:100%}\n"] }]
+            args: [{ selector: 'sci-scrollbar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<!-- scrolltrack to move the viewport client upwards (paging) -->\n<div class=\"scrolltrack-start\" (mousedown)=\"onScrollTrackMouseDown($event, 'up')\"></div>\n\n<!-- scrollthumb -->\n<div #thumb_handle\n     class=\"thumb-handle\"\n     [class.vertical]=\"vertical\"\n     [class.horizontal]=\"horizontal\"\n     (mousedown)=\"onMouseDown($event)\"\n     (touchstart)=\"onTouchStart($event)\"\n     (touchmove)=\"onTouchMove($event)\"\n     (touchend)=\"onTouchEnd($event)\"\n     (touchcancel)=\"onTouchEnd($event)\">\n  <div class=\"thumb\"\n       [class.vertical]=\"vertical\"\n       [class.horizontal]=\"horizontal\">\n  </div>\n</div>\n\n<!-- scrolltrack to move the viewport client downwards (paging) -->\n<div class=\"scrolltrack-end\" (mousedown)=\"onScrollTrackMouseDown($event, 'down')\"></div>\n", styles: ["@charset \"UTF-8\";:host{display:flex;border:2px solid transparent;box-sizing:border-box;--\\275sci-scrollbar-thumb-position-fr: 0;--\\275sci-scrollbar-thumb-size-fr: 0}:host.vertical{flex-direction:column}:host.horizontal{flex-direction:row}:host>div.scrolltrack-start{flex-grow:var(--\\275sci-scrollbar-thumb-position-fr)}:host>div.thumb-handle{flex-basis:20px;display:flex;flex-grow:var(--\\275sci-scrollbar-thumb-size-fr);align-items:center}:host>div.thumb-handle.vertical{flex-direction:column}:host>div.thumb-handle.horizontal{flex-direction:row}:host>div.thumb-handle>div.thumb{flex:auto;border-radius:4px;background-color:var(--sci-scrollbar-color);opacity:.4;transition-duration:125ms;transition-property:width,height;transition-timing-function:ease-out}:host>div.thumb-handle>div.thumb.vertical{width:60%}:host>div.thumb-handle>div.thumb.horizontal{height:60%}:host>div.scrolltrack-end{flex-grow:calc(1 - (var(--\\275sci-scrollbar-thumb-position-fr) + var(--\\275sci-scrollbar-thumb-size-fr)))}:host-context:not(.overflow){display:none}:host-context:hover>div.thumb-handle>div.thumb,:host-context(.scrolling)>div.thumb-handle>div.thumb{background-color:var(--sci-scrollbar-color);opacity:.75}:host-context:hover>div.thumb-handle>div.thumb.vertical,:host-context(.scrolling)>div.thumb-handle>div.thumb.vertical{width:100%}:host-context:hover>div.thumb-handle>div.thumb.horizontal,:host-context(.scrolling)>div.thumb-handle>div.thumb.horizontal{height:100%}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
@@ -777,10 +777,10 @@ class SciViewportComponent {
         } while (el !== this.host.nativeElement);
         return offset;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciViewportComponent, deps: [{ token: i0.ElementRef }, { token: SciNativeScrollbarTrackSizeProvider }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.2", type: SciViewportComponent, isStandalone: true, selector: "sci-viewport", inputs: { scrollbarStyle: "scrollbarStyle" }, outputs: { scroll: "scroll" }, host: { listeners: { "focus": "focus()" } }, viewQueries: [{ propertyName: "setViewport", first: true, predicate: ["viewport"], descendants: true, static: true }, { propertyName: "setViewportClient", first: true, predicate: ["viewport_client"], descendants: true, static: true }], ngImport: i0, template: "<!-- viewport and viewport client -->\n<div #viewport\n     class=\"viewport\"\n     tabindex=\"-1\"\n     sciScrollable [sciScrollableDisplayNativeScrollbar]=\"scrollbarStyle === 'native'\"\n     cdkScrollable\n     (scroll)=\"onScroll($event)\">\n  <div #viewport_client class=\"viewport-client\" part=\"content\">\n    <slot></slot>\n  </div>\n</div>\n\n<!-- render emulated scrollbars which sit on-top -->\n<ng-container *ngIf=\"scrollbarStyle === 'on-top' && (nativeScrollbarTrackSizeProvider.trackSize$ | async) !== null\">\n  <sci-scrollbar [direction]=\"'vscroll'\" [viewport]=\"viewport\" class=\"e2e-vertical\"></sci-scrollbar>\n  <sci-scrollbar [direction]=\"'hscroll'\" [viewport]=\"viewport\" class=\"e2e-horizontal\"></sci-scrollbar>\n</ng-container>\n", styles: ["@charset \"UTF-8\";:host{--\\275sci-viewport-scrollbar-color: var(--sci-viewport-scrollbar-color, rgb(78, 78, 78));display:grid;grid-template-columns:100%;grid-template-rows:100%;position:relative;overflow:hidden;outline:none}:host:host-context(:not(:hover):not(:active)) sci-scrollbar:not(.scrolling){opacity:0}:host>div.viewport{display:grid;position:relative;outline:none;-webkit-overflow-scrolling:touch}:host>div.viewport>div.viewport-client{display:grid}:host>sci-scrollbar{--sci-scrollbar-color: var(--\\275sci-viewport-scrollbar-color);position:absolute;transition-duration:1s;transition-property:opacity;transition-timing-function:ease-out}:host>sci-scrollbar.vertical{top:0;right:0;bottom:0;left:unset;width:12px}:host>sci-scrollbar.horizontal{top:unset;right:0;bottom:0;left:0;height:12px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i2.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: SciScrollableDirective, selector: "[sciScrollable]", inputs: ["sciScrollableDisplayNativeScrollbar"] }, { kind: "component", type: SciScrollbarComponent, selector: "sci-scrollbar", inputs: ["direction", "viewport"] }], encapsulation: i0.ViewEncapsulation.ShadowDom }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciViewportComponent, deps: [{ token: i0.ElementRef }, { token: SciNativeScrollbarTrackSizeProvider }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.1", type: SciViewportComponent, isStandalone: true, selector: "sci-viewport", inputs: { scrollbarStyle: "scrollbarStyle" }, outputs: { scroll: "scroll" }, host: { listeners: { "focus": "focus()" } }, viewQueries: [{ propertyName: "setViewport", first: true, predicate: ["viewport"], descendants: true, static: true }, { propertyName: "setViewportClient", first: true, predicate: ["viewport_client"], descendants: true, static: true }], ngImport: i0, template: "<!-- viewport and viewport client -->\n<div #viewport\n     class=\"viewport\"\n     tabindex=\"-1\"\n     sciScrollable [sciScrollableDisplayNativeScrollbar]=\"scrollbarStyle === 'native'\"\n     cdkScrollable\n     (scroll)=\"onScroll($event)\">\n  <div #viewport_client class=\"viewport-client\" part=\"content\">\n    <slot></slot>\n  </div>\n</div>\n\n<!-- render emulated scrollbars which sit on-top -->\n<ng-container *ngIf=\"scrollbarStyle === 'on-top' && (nativeScrollbarTrackSizeProvider.trackSize$ | async) !== null\">\n  <sci-scrollbar [direction]=\"'vscroll'\" [viewport]=\"viewport\" class=\"e2e-vertical\"></sci-scrollbar>\n  <sci-scrollbar [direction]=\"'hscroll'\" [viewport]=\"viewport\" class=\"e2e-horizontal\"></sci-scrollbar>\n</ng-container>\n", styles: [":host{display:grid;grid-template-columns:100%;grid-template-rows:100%;position:relative;overflow:hidden;outline:none}:host:host-context(:not(:hover):not(:active)) sci-scrollbar:not(.scrolling){opacity:0}:host>div.viewport{display:grid;position:relative;outline:none;-webkit-overflow-scrolling:touch}:host>div.viewport>div.viewport-client{display:grid}:host>sci-scrollbar{--sci-scrollbar-color: var(--sci-viewport-scrollbar-color);position:absolute;transition-duration:1s;transition-property:opacity;transition-timing-function:ease-out}:host>sci-scrollbar.vertical{top:0;right:0;bottom:0;left:unset;width:12px}:host>sci-scrollbar.horizontal{top:unset;right:0;bottom:0;left:0;height:12px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i2.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: SciScrollableDirective, selector: "[sciScrollable]", inputs: ["sciScrollableDisplayNativeScrollbar"] }, { kind: "component", type: SciScrollbarComponent, selector: "sci-scrollbar", inputs: ["direction", "viewport"] }], encapsulation: i0.ViewEncapsulation.ShadowDom }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciViewportComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciViewportComponent, decorators: [{
             type: Component,
             args: [{ selector: 'sci-viewport', encapsulation: ViewEncapsulation.ShadowDom, standalone: true, imports: [
                         NgIf,
@@ -788,7 +788,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImpor
                         ScrollingModule,
                         SciScrollableDirective,
                         SciScrollbarComponent,
-                    ], template: "<!-- viewport and viewport client -->\n<div #viewport\n     class=\"viewport\"\n     tabindex=\"-1\"\n     sciScrollable [sciScrollableDisplayNativeScrollbar]=\"scrollbarStyle === 'native'\"\n     cdkScrollable\n     (scroll)=\"onScroll($event)\">\n  <div #viewport_client class=\"viewport-client\" part=\"content\">\n    <slot></slot>\n  </div>\n</div>\n\n<!-- render emulated scrollbars which sit on-top -->\n<ng-container *ngIf=\"scrollbarStyle === 'on-top' && (nativeScrollbarTrackSizeProvider.trackSize$ | async) !== null\">\n  <sci-scrollbar [direction]=\"'vscroll'\" [viewport]=\"viewport\" class=\"e2e-vertical\"></sci-scrollbar>\n  <sci-scrollbar [direction]=\"'hscroll'\" [viewport]=\"viewport\" class=\"e2e-horizontal\"></sci-scrollbar>\n</ng-container>\n", styles: ["@charset \"UTF-8\";:host{--\\275sci-viewport-scrollbar-color: var(--sci-viewport-scrollbar-color, rgb(78, 78, 78));display:grid;grid-template-columns:100%;grid-template-rows:100%;position:relative;overflow:hidden;outline:none}:host:host-context(:not(:hover):not(:active)) sci-scrollbar:not(.scrolling){opacity:0}:host>div.viewport{display:grid;position:relative;outline:none;-webkit-overflow-scrolling:touch}:host>div.viewport>div.viewport-client{display:grid}:host>sci-scrollbar{--sci-scrollbar-color: var(--\\275sci-viewport-scrollbar-color);position:absolute;transition-duration:1s;transition-property:opacity;transition-timing-function:ease-out}:host>sci-scrollbar.vertical{top:0;right:0;bottom:0;left:unset;width:12px}:host>sci-scrollbar.horizontal{top:unset;right:0;bottom:0;left:0;height:12px}\n"] }]
+                    ], template: "<!-- viewport and viewport client -->\n<div #viewport\n     class=\"viewport\"\n     tabindex=\"-1\"\n     sciScrollable [sciScrollableDisplayNativeScrollbar]=\"scrollbarStyle === 'native'\"\n     cdkScrollable\n     (scroll)=\"onScroll($event)\">\n  <div #viewport_client class=\"viewport-client\" part=\"content\">\n    <slot></slot>\n  </div>\n</div>\n\n<!-- render emulated scrollbars which sit on-top -->\n<ng-container *ngIf=\"scrollbarStyle === 'on-top' && (nativeScrollbarTrackSizeProvider.trackSize$ | async) !== null\">\n  <sci-scrollbar [direction]=\"'vscroll'\" [viewport]=\"viewport\" class=\"e2e-vertical\"></sci-scrollbar>\n  <sci-scrollbar [direction]=\"'hscroll'\" [viewport]=\"viewport\" class=\"e2e-horizontal\"></sci-scrollbar>\n</ng-container>\n", styles: [":host{display:grid;grid-template-columns:100%;grid-template-rows:100%;position:relative;overflow:hidden;outline:none}:host:host-context(:not(:hover):not(:active)) sci-scrollbar:not(.scrolling){opacity:0}:host>div.viewport{display:grid;position:relative;outline:none;-webkit-overflow-scrolling:touch}:host>div.viewport>div.viewport-client{display:grid}:host>sci-scrollbar{--sci-scrollbar-color: var(--sci-viewport-scrollbar-color);position:absolute;transition-duration:1s;transition-property:opacity;transition-timing-function:ease-out}:host>sci-scrollbar.vertical{top:0;right:0;bottom:0;left:unset;width:12px}:host>sci-scrollbar.horizontal{top:unset;right:0;bottom:0;left:0;height:12px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: SciNativeScrollbarTrackSizeProvider }], propDecorators: { setViewport: [{
                 type: ViewChild,
                 args: ['viewport', { static: true }]
@@ -817,15 +817,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImpor
  * Provides a viewport component with scrollbars that sit on top of the viewport client.
  */
 class SciViewportModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciViewportModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.2", ngImport: i0, type: SciViewportModule, imports: [SciViewportComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciViewportModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.1", ngImport: i0, type: SciViewportModule, imports: [SciViewportComponent,
             SciScrollbarComponent,
             SciScrollableDirective], exports: [SciViewportComponent,
             SciScrollbarComponent,
             SciScrollableDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciViewportModule, imports: [SciViewportComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciViewportModule, imports: [SciViewportComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.2", ngImport: i0, type: SciViewportModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SciViewportModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [