From 5eb086d5306d3f3dde8ec0fe344a9fe9c67143db Mon Sep 17 00:00:00 2001
From: Joe Numainville <josephnumainville@deephaven.io>
Date: Fri, 10 May 2024 15:51:32 -0500
Subject: [PATCH 1/2] improve ui

---
 ...{ cookiecutter.__js_plugin_view_obj }}.tsx | 29 +++++++++----------
 1 file changed, 14 insertions(+), 15 deletions(-)

diff --git a/templates/widget/{{ cookiecutter.python_project_name }}/src/js/src/{{ cookiecutter.__js_plugin_view_obj }}.tsx b/templates/widget/{{ cookiecutter.python_project_name }}/src/js/src/{{ cookiecutter.__js_plugin_view_obj }}.tsx
index d0ff16958..81185fc92 100644
--- a/templates/widget/{{ cookiecutter.python_project_name }}/src/js/src/{{ cookiecutter.__js_plugin_view_obj }}.tsx	
+++ b/templates/widget/{{ cookiecutter.python_project_name }}/src/js/src/{{ cookiecutter.__js_plugin_view_obj }}.tsx	
@@ -3,6 +3,7 @@ import { useApi } from '@deephaven/jsapi-bootstrap';
 import Log from '@deephaven/log';
 import { WidgetComponentProps } from '@deephaven/plugin';
 import type { Widget } from '@deephaven/jsapi-types';
+import { Button, TextArea } from '@deephaven/components';
 
 const log = Log.module('{{ cookiecutter.javascript_project_name }}.{{ cookiecutter.__js_plugin_view_obj }}');
 
@@ -53,22 +54,20 @@ export function {{ cookiecutter.__js_plugin_view_obj }}(props: WidgetComponentPr
     <div style={{ "{" }}{{ cookiecutter.__js_plugin_view_obj_style }}{{ "}" }}>
       <div>{text}</div>
       <div>Send a message to the server:</div>
-      <div>
-        <input
-          type="text"
+      <TextArea
           value={formText}
-          onChange={(e) => setFormText(e.target.value)}
-        />
-        <button
-          onClick={() => {
-            // Send the message to the server via the widget
-            if (widget) {
-              widget.sendMessage(formText, []);
-            }
-          }}>
-          Send
-        </button>
-      </div>
+          onChange={(value) => setFormText(value)}
+          marginBottom='size-50'
+      />
+      <Button
+        onClick={() => {
+          // Send the message to the server via the widget
+          if (widget) {
+            widget.sendMessage(formText, []);
+          }
+        }}>
+        Send
+      </Button>
     </div>
   );
 }

From 8cb245ef47c3fab69ed90bdad52378110bf86b23 Mon Sep 17 00:00:00 2001
From: Joe Numainville <josephnumainville@deephaven.io>
Date: Fri, 10 May 2024 16:03:22 -0500
Subject: [PATCH 2/2] field

---
 .../src/js/src/{{ cookiecutter.__js_plugin_view_obj }}.tsx    | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/templates/widget/{{ cookiecutter.python_project_name }}/src/js/src/{{ cookiecutter.__js_plugin_view_obj }}.tsx b/templates/widget/{{ cookiecutter.python_project_name }}/src/js/src/{{ cookiecutter.__js_plugin_view_obj }}.tsx
index 81185fc92..81773f128 100644
--- a/templates/widget/{{ cookiecutter.python_project_name }}/src/js/src/{{ cookiecutter.__js_plugin_view_obj }}.tsx	
+++ b/templates/widget/{{ cookiecutter.python_project_name }}/src/js/src/{{ cookiecutter.__js_plugin_view_obj }}.tsx	
@@ -3,7 +3,7 @@ import { useApi } from '@deephaven/jsapi-bootstrap';
 import Log from '@deephaven/log';
 import { WidgetComponentProps } from '@deephaven/plugin';
 import type { Widget } from '@deephaven/jsapi-types';
-import { Button, TextArea } from '@deephaven/components';
+import { Button, TextField } from '@deephaven/components';
 
 const log = Log.module('{{ cookiecutter.javascript_project_name }}.{{ cookiecutter.__js_plugin_view_obj }}');
 
@@ -54,7 +54,7 @@ export function {{ cookiecutter.__js_plugin_view_obj }}(props: WidgetComponentPr
     <div style={{ "{" }}{{ cookiecutter.__js_plugin_view_obj_style }}{{ "}" }}>
       <div>{text}</div>
       <div>Send a message to the server:</div>
-      <TextArea
+      <TextField
           value={formText}
           onChange={(value) => setFormText(value)}
           marginBottom='size-50'