Add textarea support to popup custom inputs (#5167) - Add 'textarea' as a valid input type alongside 'checkbox' and 'text' - Add optional `rows` property to control textarea height (default: 1) - Implement textarea rendering with proper label, placeholder, and styling - Update result collection logic to handle textarea values like text inputs - Update warning message to include textarea in supported types

87a0ac7cd14748e79f6d90941d0b5c38113baee6

Wolfsblvt <wolfsblvt@gmail.com>

Signed
1 files changed, +24 -3Ignore whitespace
public/scripts/popup.js+24 -3
@@ -73,7 +73,8 @@ export const POPUP_RESULT = {
7373 * @property {string} label - The label text for the input
7474 * @property {string?} [tooltip=null] - Optional tooltip icon displayed behind the label
7575 * @property {boolean|string|undefined} [defaultState=false] - The default state when opening the popup (false if not set)
7676 * @property {string('checkbox'|'text'|'textarea')?} [type='checkbox'] - The type of the input (default is checkbox)
77+ * @property {number?} [rows=1] - The number of rows for the input field, if the input is 'textarea'
7778 */
7879
7980/**
@@ -307,8 +308,28 @@ export class Popup {
307308 label.appendChild(inputElement);
308309
309310 this.inputControls.appendChild(label);
311+ } else if (input.type === 'textarea') {
312+ const label = document.createElement('label');
313+ label.classList.add('text_label', 'justifyCenter');
314+ label.setAttribute('for', input.id);
315+
316+ const inputElement = document.createElement('textarea');
317+ inputElement.classList.add('text_pole', 'result-control');
318+ inputElement.id = input.id;
319+ inputElement.value = String(input.defaultState ?? '');
320+ inputElement.placeholder = input.tooltip ?? '';
321+ inputElement.rows = input.rows ?? 1;
322+
323+ const labelText = document.createElement('span');
324+ labelText.innerText = input.label;
325+ labelText.dataset.i18n = input.label;
326+
327+ label.appendChild(labelText);
328+ label.appendChild(inputElement);
329+
330+ this.inputControls.appendChild(label);
310331 } else {
311332 console.warn('Unknown custom input type. Only checkbox, text and texttextarea are supported.', input);
312333 return;
313334 }
314335 });
@@ -583,7 +604,7 @@ export class Popup {
583604 this.inputResults = new Map(this.customInputs.map(input => {
584605 /** @type {HTMLInputElement} */
585606 const inputControl = this.dlg.querySelector(`#${input.id}`);
586607 const value = input.type === ['text', 'textarea'].includes(input.type) ? inputControl.value : inputControl.checked;
587608 return [inputControl.id, value];
588609 }));
589610 }