Support for Rich Text Input (#630)

* Support for Rich Text Input

* rich text support for prefilled

* apply Purify for rich_text

---------

Co-authored-by: Julien Nahum <julien@nahum.net>

client/components/open/forms/OpenFormField.vue

@@ -210,6 +210,7 @@ export default {
       }
       return {
         text: 'TextInput',
+        rich_text: 'RichTextAreaInput',
         number: 'TextInput',
         rating: 'RatingInput',
         scale: 'ScaleInput',

client/components/open/forms/fields/components/FieldOptions.vue

@@ -448,8 +448,15 @@
         :multiple="field.multiple === true"
         :move-to-form-assets="true"
       />
+      <rich-text-area-input
+        v-else-if="field.type === 'rich_text'"
+        name="prefill"
+        class="mt-3"
+        :form="field"
+        label="Pre-filled value"
+      />
       <text-input
-        v-else-if="!['files', 'signature'].includes(field.type)"
+        v-else-if="!['files', 'signature', 'rich_text'].includes(field.type)"
         name="prefill"
         class="mt-3"
         :form="field"

client/components/open/tables/OpenTable.vue

@@ -193,6 +193,7 @@ export default {
       rafId: null,
       fieldComponents: {
         text: shallowRef(OpenText),
+        rich_text: shallowRef(OpenText),
         number: shallowRef(OpenText),
         rating: shallowRef(OpenText),
         scale: shallowRef(OpenText),

client/components/open/tables/components/OpenText.vue

@@ -1,7 +1,5 @@
 <template>
-  <span>
-    {{ value }}
-  </span>
+  <div v-html="value" />
 </template>
 
 <script>

client/data/blocks_types.json

@@ -8,6 +8,15 @@
     "text_class": "text-blue-900",
     "is_input": true
   },
+  "rich_text": {
+    "name": "rich_text",
+    "title": "Rich Text Input",
+    "icon": "i-heroicons-bars-3-20-solid",
+    "default_block_name": "Description",
+    "bg_class": "bg-blue-100",
+    "text_class": "text-blue-900",
+    "is_input": true
+  },
   "date": {
     "name": "date",
     "title": "Date Input",