Add field note & template for wysiwyg-html interface (#20921)

* add field note for wysiwyg-html interface and meta template

* add changeset

.changeset/old-pears-pull.md

@@ -0,0 +1,5 @@
+---
+'@directus/app': patch
+---
+
+Added field note & template for wysiwyg-html interface

app/src/interfaces/input-rich-text-html/index.ts

@@ -284,6 +284,7 @@ export default defineInterface({
 				type: 'json',
 				meta: {
 					interface: 'code',
+					note: '$t:interfaces.input-rich-text-html.custom_formats_note',
 					options: {
 						language: 'json',
 						template: JSON.stringify(
@@ -308,8 +309,17 @@ export default defineInterface({
 				type: 'json',
 				meta: {
 					interface: 'code',
+					note: '$t:interfaces.input-rich-text-html.options_override_note',
 					options: {
 						language: 'json',
+						template: JSON.stringify(
+							{
+								font_size_formats: '8pt 10pt 12pt 14pt 16pt 18pt 24pt 36pt 48pt',
+								font_family_formats: 'Arial=arial,helvetica,sans-serif; Courier New=courier new,courier,monospace;',
+							},
+							null,
+							4,
+						),
 					},
 				},
 			},

app/src/lang/translations/en-US.yaml

@@ -1889,7 +1889,13 @@ interfaces:
     description: A rich-text editor writing HTML content
     toolbar: Toolbar
     custom_formats: Custom Formats
+    custom_formats_note:
+      List of TinyMCE Content Formats. See the TinyMCE documentation about [Content
+      Formatting](https://www.tiny.cloud/docs/tinymce/latest/content-formatting/) for more information.
     options_override: Options Override
+    options_override_note:
+      The TinyMCE User Formatting keys and their values. See the TinyMCE documentation about [User
+      Formatting](https://www.tiny.cloud/docs/tinymce/latest/user-formatting-options/) for more information.
     folder_note: Folder for uploaded files. Does not affect existing files.
     imageToken: Static Access Token
     imageToken_label: Static access token is appended to the assets' URL