feat(editor): Harmonize rendering of new-lines in RunData (#9614)

Signed-off-by: Oleg Ivaniv <me@olegivaniv.com>
Co-authored-by: Giulio Andreini <g.andreini@gmail.com>
This commit is contained in:
oleg
2024-06-10 15:24:17 +02:00
committed by GitHub
parent 22bdb0568e
commit bc3dcf706f
9 changed files with 311 additions and 68 deletions

View File

@@ -38,6 +38,7 @@ const key = computed((): string | undefined => {
const schemaName = computed(() =>
isSchemaParentTypeArray.value ? `${props.schema.type}[${props.schema.key}]` : props.schema.key,
);
const text = computed(() =>
Array.isArray(props.schema.value) ? '' : shorten(props.schema.value, 600, 0),
);
@@ -114,7 +115,11 @@ const getIconBySchemaType = (type: Schema['type']): string => {
/>
</span>
</div>
<span v-if="text" :class="$style.text">{{ text }}</span>
<span v-if="text" :class="$style.text">
<template v-for="(line, index) in text.split('\n')" :key="`line-${index}`">
<span v-if="index > 0" :class="$style.newLine">\n</span>{{ line }}
</template>
</span>
<input v-if="level > 0 && isSchemaValueArray" :id="subKey" type="checkbox" checked />
<label v-if="level > 0 && isSchemaValueArray" :class="$style.toggle" :for="subKey">
<font-awesome-icon icon="angle-up" />
@@ -286,6 +291,12 @@ const getIconBySchemaType = (type: Schema['type']): string => {
font-size: var(--font-size-2xs);
overflow: hidden;
word-break: break-word;
.newLine {
font-family: var(--font-family-monospace);
color: var(--color-line-break);
padding-right: 2px;
}
}
.toggle {