From 9eda31e2a0b26c79d7e88ed0dbc6f475c43d1ba7 Mon Sep 17 00:00:00 2001
From: wangleping <wangleping@xiaohongshu.com>
Date: Thu, 22 Aug 2024 11:29:17 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20-=20Preview=20=E9=9D=A2=E6=9D=BF?=
 =?UTF-8?q?=E8=BF=90=E8=A1=8C=E6=97=B6=E9=94=99=E8=AF=AF=E5=8F=AF=E9=85=8D?=
 =?UTF-8?q?=E7=BD=AE=E5=85=B3=E9=97=AD=20-=20Editor=20ShowError=20?=
 =?UTF-8?q?=E6=96=87=E6=A1=A3=E6=94=AF=E6=8C=81=E5=AE=9A=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/Repl.vue                 | 11 +++++++++++
 src/editor/MessageToggle.vue |  6 +++++-
 src/output/Preview.vue       |  4 ++--
 3 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/src/Repl.vue b/src/Repl.vue
index 30e0bc20..3520a8df 100644
--- a/src/Repl.vue
+++ b/src/Repl.vue
@@ -28,6 +28,11 @@ export interface Props {
       importCode?: string
       useCode?: string
     }
+    showRuntimeError?: boolean
+    showRuntimeWarning?: boolean
+  }
+  editorOptions?: {
+    ShowErrorText?: string
   }
 }
 
@@ -51,8 +56,13 @@ const props = withDefaults(defineProps<Props>(), {
       importCode: '',
       useCode: '',
     },
+    showRuntimeError: true,
+    showRuntimeWarning: true,
   }),
   layout: 'horizontal',
+  editorOptions: () => ({
+    ShowErrorText: 'Show Error',
+  }),
 })
 
 if (!props.editor) {
@@ -73,6 +83,7 @@ provide('import-map', toRef(props, 'showImportMap'))
 provide('tsconfig', toRef(props, 'showTsConfig'))
 provide('clear-console', toRef(props, 'clearConsole'))
 provide('preview-options', props.previewOptions)
+provide('editor-options', props.editorOptions)
 provide('theme', toRef(props, 'theme'))
 provide('preview-theme', toRef(props, 'previewTheme'))
 provide('preview-ref', () => outputRef.value?.previewRef?.container)
diff --git a/src/editor/MessageToggle.vue b/src/editor/MessageToggle.vue
index 7c7943cf..107ff665 100644
--- a/src/editor/MessageToggle.vue
+++ b/src/editor/MessageToggle.vue
@@ -1,10 +1,14 @@
 <script setup lang="ts">
+import { inject } from 'vue'
+import type { Props } from '../Repl.vue'
+
+const editorOptions = inject<Props['editorOptions']>('editor-options')
 const visible = defineModel<boolean>()
 </script>
 
 <template>
   <div class="wrapper" @click="visible = !visible">
-    <span>Show Error</span>
+    <span>{{ editorOptions?.ShowErrorText }}</span>
     <div class="toggle" :class="[{ active: modelValue }]">
       <div class="indicator" />
     </div>
diff --git a/src/output/Preview.vue b/src/output/Preview.vue
index a86eb827..793ee957 100644
--- a/src/output/Preview.vue
+++ b/src/output/Preview.vue
@@ -296,8 +296,8 @@ defineExpose({ reload, container })
     class="iframe-container"
     :class="{ [theme]: previewTheme }"
   />
-  <Message :err="runtimeError" />
-  <Message v-if="!runtimeError" :warn="runtimeWarning" />
+  <Message :err="runtimeError && previewOptions?.showRuntimeError" />
+  <Message v-if="!runtimeError && previewOptions?.showRuntimeWarning" :warn="runtimeWarning" />
 </template>
 
 <style scoped>