aboutsummaryrefslogtreecommitdiff
path: root/app/src/web/ts/auto_resize_textarea.ts
diff options
context:
space:
mode:
Diffstat (limited to 'app/src/web/ts/auto_resize_textarea.ts')
-rw-r--r--app/src/web/ts/auto_resize_textarea.ts15
1 files changed, 12 insertions, 3 deletions
diff --git a/app/src/web/ts/auto_resize_textarea.ts b/app/src/web/ts/auto_resize_textarea.ts
index f690d4c0..e170d14e 100644
--- a/app/src/web/ts/auto_resize_textarea.ts
+++ b/app/src/web/ts/auto_resize_textarea.ts
@@ -1,15 +1,24 @@
// Credits to https://codepen.io/tomhodgins/pen/KgazaE
(function () {
- const textareas = <NodeListOf<HTMLTextAreaElement>>document.querySelectorAll('textarea.frostAutoExpand');
+ const textareas = <NodeListOf<HTMLTextAreaElement>>document.querySelectorAll('textarea:not(.frostAutoExpand)');
+
+ const dataAttribute = 'data-frost-minHeight';
const _frostAutoExpand = (el: HTMLElement) => {
- el.style.height = 'inherit'
- el.style.height = `${el.scrollHeight}px`
+ if (!el.hasAttribute(dataAttribute)) {
+ el.setAttribute(dataAttribute, el.offsetHeight.toString());
+ }
+ // If no height is defined, have min bound to current height;
+ // otherwise we will allow for height decreases in case user deletes text
+ const minHeight = parseInt(el.getAttribute(dataAttribute) ?? '0');
+ el.style.height = 'inherit';
+ el.style.height = `${Math.max(el.scrollHeight, minHeight)}px`;
};
function _frostExpandAll() {
textareas.forEach(_frostAutoExpand);
}
textareas.forEach(el => {
+ el.classList.add('frostAutoExpand')
const __frostAutoExpand = () => {
_frostAutoExpand(el)
};