1 files changed, 25 insertions, 0 deletions

diff --git a/client/src/app/shared/shared-forms/textarea-autoresize.directive.ts b/client/src/app/shared/shared-forms/textarea-autoresize.directive.ts
new file mode 100644
index 000000000..f8c855c16
--- /dev/null
+++ b/client/src/app/shared/shared-forms/textarea-autoresize.directive.ts
@@ -0,0 +1,25 @@
+// Thanks: https://github.com/evseevdev/ngx-textarea-autosize
+import { AfterViewInit, Directive, ElementRef, HostBinding, HostListener } from '@angular/core'
+
+@Directive({
+  selector: 'textarea[myAutoResize]'
+})
+export class TextareaAutoResizeDirective implements AfterViewInit {
+  @HostBinding('attr.rows') rows = '1'
+  @HostBinding('style.overflow') overflow = 'hidden'
+
+  constructor (private elem: ElementRef) { }
+
+  public ngAfterViewInit () {
+    this.resize()
+  }
+
+  @HostListener('input')
+  resize () {
+    const textarea = this.elem.nativeElement as HTMLTextAreaElement
+    // Reset textarea height to auto that correctly calculate the new height
+    textarea.style.height = 'auto'
+    // Set new height
+    textarea.style.height = `${textarea.scrollHeight}px`
+  }
+}