From e34ca22499f57188e65bd440cd929282997e897e Mon Sep 17 00:00:00 2001
From: nathan <nathangray.bsc+github@gmail.com>
Date: Fri, 20 Aug 2021 15:52:22 -0600
Subject: [PATCH] Split textarea off from textbox & start implementing

Splitting the two made things a lot simpler to deal with
---
 api/js/etemplate/Et2Textarea.ts      | 85 ++++++++++++++++++++++++++++
 api/js/etemplate/Et2Textbox.ts       |  3 +-
 api/js/etemplate/etemplate2.ts       |  1 +
 api/src/Etemplate/Widget/Textbox.php |  4 +-
 infolog/templates/default/edit.xet   |  2 +-
 package.json                         |  1 +
 6 files changed, 92 insertions(+), 4 deletions(-)
 create mode 100644 api/js/etemplate/Et2Textarea.ts

diff --git a/api/js/etemplate/Et2Textarea.ts b/api/js/etemplate/Et2Textarea.ts
new file mode 100644
index 0000000000..d2bf9069a8
--- /dev/null
+++ b/api/js/etemplate/Et2Textarea.ts
@@ -0,0 +1,85 @@
+/**
+ * EGroupware eTemplate2 - Textbox widget (WebComponent)
+ *
+ * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
+ * @package etemplate
+ * @subpackage api
+ * @link https://www.egroupware.org
+ * @author Nathan Gray
+ */
+
+
+import {css, html} from "../../../node_modules/@lion/core/index.js"
+import {LionTextarea} from "../../../node_modules/@lion/textarea/index.js"
+import {Et2InputWidget} from "./et2_core_inputWidget";
+import {Et2Widget} from "./Et2Widget";
+
+
+export class Et2Textarea extends Et2InputWidget(Et2Widget(LionTextarea))
+{
+	static get styles()
+	{
+		return [
+			...super.styles,
+			css`
+			:host {
+				display: block;
+				width: 100%;
+				height: 100%;
+            }
+			`,
+		];
+	}
+
+	static get properties()
+	{
+		return {
+			...super.properties,
+			/**
+			 * Specify the width of the text area.
+			 * If not set, it will expand to fill the space available.
+			 */
+			width: {type: String, reflect: true},
+			/**
+			 * Specify the height of the text area.
+			 * If not set, it will expand to fill the space available.
+			 */
+			height: {type: String, reflect: true},
+			onkeypress: Function,
+		}
+	}
+
+	constructor()
+	{
+		super();
+
+		// Unset parent's defaults
+		this.rows = undefined;
+		this.maxRows = undefined;
+	}
+
+	connectedCallback()
+	{
+		super.connectedCallback();
+	}
+
+	set width(value)
+	{
+		if(this._inputNode)
+		{
+			this._inputNode.style.width = value;
+		}
+		this.resizeTextarea();
+	}
+
+	set height(value)
+	{
+		if(this._inputNode)
+		{
+			this._inputNode.style.height = value;
+		}
+		this.resizeTextarea();
+	}
+}
+
+customElements.define("et2-textarea", Et2Textarea);
diff --git a/api/js/etemplate/Et2Textbox.ts b/api/js/etemplate/Et2Textbox.ts
index d4638a2cf7..76e7379eeb 100644
--- a/api/js/etemplate/Et2Textbox.ts
+++ b/api/js/etemplate/Et2Textbox.ts
@@ -31,7 +31,7 @@ export class Et2Textbox extends Et2InputWidget(Et2Widget(LionInput))
 	{
 		return {
 			...super.properties,
-			onclick: {type: Function}
+			onkeypress: Function,
 		}
 	}
 
@@ -43,7 +43,6 @@ export class Et2Textbox extends Et2InputWidget(Et2Widget(LionInput))
 	connectedCallback()
 	{
 		super.connectedCallback();
-
 	}
 }
 
diff --git a/api/js/etemplate/etemplate2.ts b/api/js/etemplate/etemplate2.ts
index 6f75ffb99a..7af31b1ccb 100644
--- a/api/js/etemplate/etemplate2.ts
+++ b/api/js/etemplate/etemplate2.ts
@@ -26,6 +26,7 @@ import {egwIsMobile} from "../egw_action/egw_action_common.js";
 import './Et2Box';
 import './Et2Button';
 import './Et2Date';
+import './Et2Textarea';
 import './Et2Textbox';
 /* Include all widget classes here, we only care about them registering, not importing anything*/
 import './et2_widget_vfs'; // Vfs must be first (before et2_widget_file) due to import cycle
diff --git a/api/src/Etemplate/Widget/Textbox.php b/api/src/Etemplate/Widget/Textbox.php
index 529820d41c..74717982ac 100644
--- a/api/src/Etemplate/Widget/Textbox.php
+++ b/api/src/Etemplate/Widget/Textbox.php
@@ -179,4 +179,6 @@ class Textbox extends Etemplate\Widget
 		}
 	}
 }
-Etemplate\Widget::registerWidget(__NAMESPACE__.'\\Textbox', array('et2-textbox','textbox','text','int','integer','float','hidden','colorpicker','hidden'));
+Etemplate\Widget::registerWidget(__NAMESPACE__ . '\\Textbox', array('et2-textarea', 'et2-textbox', 'textbox', 'text',
+																	'int', 'integer', 'float', 'hidden', 'colorpicker',
+																	'hidden'));
diff --git a/infolog/templates/default/edit.xet b/infolog/templates/default/edit.xet
index 2fac2f2431..3683af0cc9 100644
--- a/infolog/templates/default/edit.xet
+++ b/infolog/templates/default/edit.xet
@@ -3,7 +3,7 @@
 <!-- $Id$ -->
 <overlay>
 	<template id="infolog.edit.description" template="" lang="" group="0" version="1.6.001">
-		<textbox multiline="true"  id="info_des" no_lang="1" width="99.7%" height="245px"/>
+		<et2-textarea  id="info_des" no_lang="1" width="99.7%" height="245px"/>
 		<checkbox id="clean_history"/>
 	</template>
 	<template id="infolog.edit.links" template="" lang="" group="0" version="1.3.001">
diff --git a/package.json b/package.json
index 903a62e09d..d6aef57d26 100644
--- a/package.json
+++ b/package.json
@@ -51,6 +51,7 @@
     "@lion/input": "^0.15.4",
     "@lion/input-date": "^0.12.6",
     "@lion/input-datepicker": "^0.23.6",
+    "@lion/textarea": "^0.13.4",
     "jquery-ui-dist": "^1.12.1",
     "jquery-ui-themes": "^1.12.0",
     "jquery-ui-timepicker-addon": "^1.6.3",