From c8d71bb5164bf4fee4a6204cb07359f4ce0cdbfd Mon Sep 17 00:00:00 2001 From: Florian Bouillon Date: Tue, 21 Jul 2020 11:33:46 +0200 Subject: [PATCH] Added TextAreaInput for textarea resizing Signed-off-by: Florian Bouillon --- src/modules/TextAreaInput.ts | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) create mode 100644 src/modules/TextAreaInput.ts diff --git a/src/modules/TextAreaInput.ts b/src/modules/TextAreaInput.ts new file mode 100644 index 0000000..bf24565 --- /dev/null +++ b/src/modules/TextAreaInput.ts @@ -0,0 +1,24 @@ +import InputIdentity from "./Interfaces/InputIdentity" +import DefaultInput from "./DefaultInput" +import FormManager from "../FormManager" + +export default class TextAreaInput extends DefaultInput { + + public constructor(element: HTMLElement, form: FormManager) { + super(element, form) + element.style.resize = 'none' + const event = () => { + element.style.minHeight = "5px" + element.style.minHeight = `calc(2em + ${element.scrollHeight+5}px)` + } + ;(element as HTMLTextAreaElement).addEventListener('keydown', event) + ;(element as HTMLTextAreaElement).addEventListener('keypress', event) + + } + + public static identity: InputIdentity = { + input: TextAreaInput, + tagName: 'textarea', + attributes: 'data-autoresize' + } +}