fix(autoresize_controller.ts): ensure to bind autoresize-textarea when element is visible, otherwise it is not expanded by 5 rows as expected by default
cleaner ts implementation Co-authored-by: Colin Darie <colin@darie.eu>
This commit is contained in:
parent
44d5704af2
commit
a3050348e2
1 changed files with 16 additions and 1 deletions
|
@ -3,16 +3,31 @@ import { attach } from '@frsource/autoresize-textarea';
|
|||
import { isTextAreaElement } from '@coldwired/utils';
|
||||
|
||||
export class AutoresizeController extends ApplicationController {
|
||||
declare observer: IntersectionObserver;
|
||||
|
||||
#detach?: () => void;
|
||||
connect(): void {
|
||||
if (isTextAreaElement(this.element)) {
|
||||
this.#detach = attach(this.element)?.detach;
|
||||
this.element.classList.add('resize-none');
|
||||
this.observer = new IntersectionObserver(this.onIntersect.bind(this), {
|
||||
threshold: [0]
|
||||
});
|
||||
this.observer.observe(this.element);
|
||||
}
|
||||
}
|
||||
|
||||
onIntersect(entries: IntersectionObserverEntry[]): void {
|
||||
const visible = entries[0].isIntersecting == true;
|
||||
|
||||
if (visible) {
|
||||
this.#detach = attach(this.element as HTMLTextAreaElement)?.detach;
|
||||
this.observer.unobserve(this.element);
|
||||
}
|
||||
}
|
||||
|
||||
disconnect(): void {
|
||||
this.#detach?.();
|
||||
this.observer.unobserve(this.element);
|
||||
this.element.classList.remove('resize-none');
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue