Feature: Update design for web widget (#408)

app/javascript/widget/components/ResizableTextarea.vue

@@ -0,0 +1,26 @@
+<script>
+export default {
+  mounted() {
+    this.$nextTick(() => {
+      this.$el.setAttribute(
+        'style',
+        `height: ${this.$el.scrollHeight}px;overflow-y:hidden;`
+      );
+    });
+
+    this.$el.addEventListener('input', this.resizeTextarea);
+  },
+  beforeDestroy() {
+    this.$el.removeEventListener('input', this.resizeTextarea);
+  },
+  methods: {
+    resizeTextarea(event) {
+      event.target.style.height = '3.2rem';
+      event.target.style.height = `${event.target.scrollHeight}px`;
+    },
+  },
+  render() {
+    return this.$slots.default[0];
+  },
+};
+</script>