diff --git a/docs/fields/code.mdx b/docs/fields/code.mdx index 7d902a44b..380241232 100644 --- a/docs/fields/code.mdx +++ b/docs/fields/code.mdx @@ -33,13 +33,16 @@ This field uses the `monaco-react` editor syntax highlighting. | **`required`** | Require this field to have a value. | | **`admin`** | Admin-specific configuration. See below for [more detail](#admin-config). | -*\* An asterisk denotes that a property is required.* +_\* An asterisk denotes that a property is required._ -### Admin config +### Admin Config -In addition to the default [field admin config](/docs/fields/overview#admin-config), the Code field type also allows for the customization of a `language` property. +In addition to the default [field admin config](/docs/fields/overview#admin-config), you can adjust the following properties: -The [monaco-react](https://github.com/suren-atoyan/monaco-react) editor supports all of the languages supported by the [monaco-editor](https://github.com/microsoft/monaco-editor). The `language` property can be set to any of the languages listed [here](https://github.com/microsoft/monaco-editor/tree/main/src/basic-languages). +| Option | Description | +| ---------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| **`language`** | This property can be set to any language listed [here](https://github.com/microsoft/monaco-editor/tree/main/src/basic-languages). | +| **`editorOptions`** | Options that can be passed to the monaco editor, [view the full list](https://microsoft.github.io/monaco-editor/api/interfaces/monaco.editor.IDiffEditorConstructionOptions.html). | ### Example diff --git a/docs/fields/json.mdx b/docs/fields/json.mdx index b263f8a1a..a35b0c81e 100644 --- a/docs/fields/json.mdx +++ b/docs/fields/json.mdx @@ -29,9 +29,17 @@ This field uses the `monaco-react` editor syntax highlighting. | **`defaultValue`** | Provide data to be used for this field's default value. [More](/docs/fields/overview#default-values) | | **`localized`** | Enable localization for this field. Requires [localization to be enabled](/docs/configuration/localization) in the Base config. | | **`required`** | Require this field to have a value. | -| **`admin`** | Admin-specific configuration. See the [default field admin config](/docs/fields/overview#admin-config) for more details. | +| **`admin`** | Admin-specific configuration. See below for [more detail](#admin-config). | -*\* An asterisk denotes that a property is required.* +_\* An asterisk denotes that a property is required._ + +### Admin Config + +In addition to the default [field admin config](/docs/fields/overview#admin-config), you can adjust the following properties: + +| Option | Description | +| ---------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| **`editorOptions`** | Options that can be passed to the monaco editor, [view the full list](https://microsoft.github.io/monaco-editor/api/interfaces/monaco.editor.IDiffEditorConstructionOptions.html). | ### Example diff --git a/src/admin/components/forms/field-types/Code/Code.tsx b/src/admin/components/forms/field-types/Code/Code.tsx index d67c7c0d2..c557698be 100644 --- a/src/admin/components/forms/field-types/Code/Code.tsx +++ b/src/admin/components/forms/field-types/Code/Code.tsx @@ -32,9 +32,9 @@ const Code: React.FC = (props) => { language, description, condition, + editorOptions, } = {}, label, - editorOptions, } = props; const path = pathFromProps || name; diff --git a/src/admin/components/forms/field-types/JSON/JSON.tsx b/src/admin/components/forms/field-types/JSON/JSON.tsx index 49451031f..8d0aacba0 100644 --- a/src/admin/components/forms/field-types/JSON/JSON.tsx +++ b/src/admin/components/forms/field-types/JSON/JSON.tsx @@ -26,9 +26,9 @@ const JSONField: React.FC = (props) => { width, description, condition, + editorOptions, } = {}, label, - editorOptions, } = props; const path = pathFromProps || name; diff --git a/src/fields/config/types.ts b/src/fields/config/types.ts index 8cec6664f..0e7114b68 100644 --- a/src/fields/config/types.ts +++ b/src/fields/config/types.ts @@ -251,6 +251,7 @@ export type UploadField = FieldBase & { type CodeAdmin = Admin & { language?: string; + editorOptions?: EditorProps['options']; } export type CodeField = Omit & { @@ -258,13 +259,15 @@ export type CodeField = Omit & { minLength?: number maxLength?: number type: 'code'; +} + +type JSONAdmin = Admin & { editorOptions?: EditorProps['options']; } export type JSONField = Omit & { - admin?: Admin + admin?: JSONAdmin type: 'json'; - editorOptions?: EditorProps['options']; } export type SelectField = FieldBase & {