UNPKG

@progress/kendo-angular-conversational-ui

Version:

Kendo UI for Angular Conversational UI components

81 lines (80 loc) 3.52 kB
/**----------------------------------------------------------------------------------------- * Copyright © 2025 Progress Software Corporation. All rights reserved. * Licensed under commercial license. See LICENSE.md in the project root for more information *-------------------------------------------------------------------------------------------*/ import { Directive, ElementRef, EventEmitter, HostBinding, Input, NgZone, Output, Renderer2 } from '@angular/core'; import * as i0 from "@angular/core"; // Consider scroll to be at the bottom when within this number of pixels from the container height. const maxDelta = 2; /** * @hidden */ export class ScrollAnchorDirective { element; zone; renderer; autoScroll = true; autoScrollChange = new EventEmitter(); overflowAnchor = 'none'; scrolling = false; unsubscribe; constructor(element, zone, renderer) { this.element = element; this.zone = zone; this.renderer = renderer; } ngOnInit() { this.zone.runOutsideAngular(() => { this.unsubscribe = this.renderer.listen(this.element.nativeElement, 'scroll', () => this.onScroll()); }); } ngAfterViewInit() { this.scrollToBottom(); } ngOnDestroy() { if (this.unsubscribe) { this.unsubscribe(); } } onScroll() { if (this.scrolling) { return; } const el = this.element.nativeElement; const bottom = el.scrollTop + el.offsetHeight; const height = el.scrollHeight; const atBottom = height - bottom < maxDelta; if (this.autoScroll !== atBottom) { this.zone.run(() => { this.autoScroll = atBottom; this.autoScrollChange.emit(this.autoScroll); }); } } scrollToBottom() { if (!this.autoScroll) { return; } const el = this.element.nativeElement; el.scrollTop = el.scrollHeight - el.clientHeight; this.scrolling = true; this.zone.runOutsideAngular(() => setTimeout(() => this.scrolling = false, 1000)); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ScrollAnchorDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: ScrollAnchorDirective, isStandalone: true, selector: "[kendoChatScrollAnchor]", inputs: { autoScroll: "autoScroll" }, outputs: { autoScrollChange: "autoScrollChange" }, host: { properties: { "style.overflow-anchor": "this.overflowAnchor" } }, exportAs: ["scrollAnchor"], ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ScrollAnchorDirective, decorators: [{ type: Directive, args: [{ selector: '[kendoChatScrollAnchor]', exportAs: 'scrollAnchor', standalone: true }] }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.Renderer2 }]; }, propDecorators: { autoScroll: [{ type: Input }], autoScrollChange: [{ type: Output }], overflowAnchor: [{ type: HostBinding, args: ['style.overflow-anchor'] }] } });