github/directus
1
0
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-02-14 19:25:03 -05:00
Code Issues Packages Projects Releases Wiki Activity

Fix and improve raw value editor (#15868)

Browse Source 
* this works in the form-field setting up for refactor

* refactored the useRaw and made form-field-raw-editor

* add defaults

* add tests for render submitting and cancelling

* add isNil

* delete the comment

* add a cancel button

* change let to const

* add the if statement when it's not a object

* delete the .raw-value and place it in the raw-editor form field

* rename submit to setRawValue

* change submit to set-raw-value

* add a possibility to add a placeholder to the system-raw-editor

* implement the system-raw-editor to the form-field-raw-editor

* update the snapshot and fix the emitted tests

* found out we can disable the gutter and line-numbers

* add a language prop to the system when it's not defined it should default to mustache

* delete style; add language and add type

* update the html in tests

* add input-code for the extended validation

* add default value

* Update form-field-raw-editor.vue language to plaintext

Co-authored-by: Rijk van Zanten <rijkvanzanten@me.com>

* update test

Co-authored-by: Vincent Kempers <vincentkempers@vincents-mbp.lan>
Co-authored-by: Rijk van Zanten <rijkvanzanten@me.com>
This commit is contained in:
Vincent Kempers
2022-10-14 20:17:24 +02:00
committed by GitHub
parent 74b60c9154
commit 03d65e8363
5 changed files with 214 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/src/interfaces/_system/system-raw-editor/system-raw-editor.vue
View File

@@ -18,12 +18,16 @@ const props = withDefaults(
autofocus?: boolean;
disabled?: boolean;
type?: string;
language?: string;
placeholder?: string;
}>(),
{
value: undefined,
autofocus: false,
disabled: false,
type: undefined,
placeholder: undefined,
language: 'mustache',
}
);
@@ -43,7 +47,7 @@ onMounted(async () => {
CodeMirror.defineSimpleMode('mustache', mustacheMode);
codemirror = CodeMirror(codemirrorEl.value, {
mode: 'mustache',
mode: props.language,
value: typeof props.value === 'object' ? JSON.stringify(props.value, null, 4) : String(props.value ?? ''),
tabSize: 0,
autoRefresh: true,
@@ -57,7 +61,7 @@ onMounted(async () => {
scrollbarStyle: isMultiLine.value ? 'native' : 'null',
extraKeys: { Ctrl: 'autocomplete' },
cursorBlinkRate: props.disabled ? -1 : 530,
placeholder: t('raw_editor_placeholder'),
placeholder: props.placeholder !== undefined ? props.placeholder : t('raw_editor_placeholder'),
});
// prevent new lines for single lines