From 0908b0f4345aec9f42feaf0c8510a3c92169fa91 Mon Sep 17 00:00:00 2001
From: Kagol <kagol@sina.com>
Date: Fri, 27 Dec 2024 16:34:04 +0800
Subject: [PATCH 1/2] docs(fluent-editor): fixed text exceeding problem caused
 by too long content in the fluent-editor component demo

---
 .../fluent-editor/basic-usage-composition-api.vue  | 14 ++++++++++++--
 .../demos/pc/app/fluent-editor/basic-usage.vue     | 14 ++++++++++++--
 2 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/examples/sites/demos/pc/app/fluent-editor/basic-usage-composition-api.vue b/examples/sites/demos/pc/app/fluent-editor/basic-usage-composition-api.vue
index 6e7fec4fa3..2e2a41adef 100644
--- a/examples/sites/demos/pc/app/fluent-editor/basic-usage-composition-api.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/basic-usage-composition-api.vue
@@ -1,8 +1,10 @@
 <template>
   <div>
     <tiny-fluent-editor v-model="content"></tiny-fluent-editor>
-    内容：<br />
-    {{ content }}
+    <div class="fluent-editor-demo__basic-usage__content">
+      内容：<br />
+      {{ content }}
+    </div>
   </div>
 </template>
 
@@ -12,3 +14,11 @@ import { TinyFluentEditor } from '@opentiny/vue'
 
 const content = ref('{"ops":[{"insert":"Hello "},{"attributes":{"bold":true},"insert":"FluentEditor"},{"insert":"!"}]}')
 </script>
+
+<style scoped>
+.fluent-editor-demo__basic-usage__content {
+  margin: 16px 0;
+  line-height: 1.5;
+  word-break: break-word;
+}
+</style>
diff --git a/examples/sites/demos/pc/app/fluent-editor/basic-usage.vue b/examples/sites/demos/pc/app/fluent-editor/basic-usage.vue
index ac949c92c9..1247bd6a09 100644
--- a/examples/sites/demos/pc/app/fluent-editor/basic-usage.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/basic-usage.vue
@@ -1,8 +1,10 @@
 <template>
   <div>
     <tiny-fluent-editor v-model="content"></tiny-fluent-editor>
-    内容：<br />
-    {{ content }}
+    <div class="fluent-editor-demo__basic-usage__content">
+      内容：<br />
+      {{ content }}
+    </div>
   </div>
 </template>
 
@@ -20,3 +22,11 @@ export default {
   }
 }
 </script>
+
+<style scoped>
+.fluent-editor-demo__basic-usage__content {
+  margin: 16px 0;
+  line-height: 1.5;
+  word-break: break-word;
+}
+</style>

From 73bdf7ddad34a78b056f07619b894d916b9827d9 Mon Sep 17 00:00:00 2001
From: Kagol <kagol@sina.com>
Date: Fri, 27 Dec 2024 17:04:47 +0800
Subject: [PATCH 2/2] docs(fluent-editor): remove useless demo code

---
 .../basic-usage-composition-api.vue              | 10 ++++------
 .../demos/pc/app/fluent-editor/basic-usage.vue   | 10 ++++------
 .../before-editor-init-composition-api.vue       | 16 ++++++----------
 .../pc/app/fluent-editor/before-editor-init.vue  | 16 ++++++----------
 .../data-switch-composition-api.vue              |  6 +-----
 .../demos/pc/app/fluent-editor/data-switch.vue   |  6 +-----
 .../fluent-editor/disabled-composition-api.vue   |  4 +---
 .../demos/pc/app/fluent-editor/disabled.vue      |  4 +---
 .../image-upload-composition-api.vue             |  6 +-----
 .../demos/pc/app/fluent-editor/image-upload.vue  |  6 +-----
 .../fluent-editor/options-composition-api.vue    |  6 +-----
 .../sites/demos/pc/app/fluent-editor/options.vue |  6 +-----
 12 files changed, 28 insertions(+), 68 deletions(-)

diff --git a/examples/sites/demos/pc/app/fluent-editor/basic-usage-composition-api.vue b/examples/sites/demos/pc/app/fluent-editor/basic-usage-composition-api.vue
index 2e2a41adef..28b2e5cfd5 100644
--- a/examples/sites/demos/pc/app/fluent-editor/basic-usage-composition-api.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/basic-usage-composition-api.vue
@@ -1,10 +1,8 @@
 <template>
-  <div>
-    <tiny-fluent-editor v-model="content"></tiny-fluent-editor>
-    <div class="fluent-editor-demo__basic-usage__content">
-      内容：<br />
-      {{ content }}
-    </div>
+  <tiny-fluent-editor v-model="content"></tiny-fluent-editor>
+  <div class="fluent-editor-demo__basic-usage__content">
+    内容：<br />
+    {{ content }}
   </div>
 </template>
 
diff --git a/examples/sites/demos/pc/app/fluent-editor/basic-usage.vue b/examples/sites/demos/pc/app/fluent-editor/basic-usage.vue
index 1247bd6a09..539ac23237 100644
--- a/examples/sites/demos/pc/app/fluent-editor/basic-usage.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/basic-usage.vue
@@ -1,10 +1,8 @@
 <template>
-  <div>
-    <tiny-fluent-editor v-model="content"></tiny-fluent-editor>
-    <div class="fluent-editor-demo__basic-usage__content">
-      内容：<br />
-      {{ content }}
-    </div>
+  <tiny-fluent-editor v-model="content"></tiny-fluent-editor>
+  <div class="fluent-editor-demo__basic-usage__content">
+    内容：<br />
+    {{ content }}
   </div>
 </template>
 
diff --git a/examples/sites/demos/pc/app/fluent-editor/before-editor-init-composition-api.vue b/examples/sites/demos/pc/app/fluent-editor/before-editor-init-composition-api.vue
index 283e6dffb2..8c2652f795 100644
--- a/examples/sites/demos/pc/app/fluent-editor/before-editor-init-composition-api.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/before-editor-init-composition-api.vue
@@ -1,14 +1,10 @@
 <template>
-  <div>
-    <tiny-fluent-editor
-      ref="fluentEditorRef"
-      v-model="content"
-      :before-editor-init="beforeEditorInit"
-      :options="editorOptions"
-    ></tiny-fluent-editor>
-    内容：<br />
-    {{ content }}
-  </div>
+  <tiny-fluent-editor
+    ref="fluentEditorRef"
+    v-model="content"
+    :before-editor-init="beforeEditorInit"
+    :options="editorOptions"
+  ></tiny-fluent-editor>
 </template>
 
 <script setup>
diff --git a/examples/sites/demos/pc/app/fluent-editor/before-editor-init.vue b/examples/sites/demos/pc/app/fluent-editor/before-editor-init.vue
index 4275ee70b1..a932692a68 100644
--- a/examples/sites/demos/pc/app/fluent-editor/before-editor-init.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/before-editor-init.vue
@@ -1,14 +1,10 @@
 <template>
-  <div>
-    <tiny-fluent-editor
-      ref="fluentEditorRef"
-      v-model="content"
-      :before-editor-init="beforeEditorInit"
-      :options="editorOptions"
-    ></tiny-fluent-editor>
-    内容：<br />
-    {{ content }}
-  </div>
+  <tiny-fluent-editor
+    ref="fluentEditorRef"
+    v-model="content"
+    :before-editor-init="beforeEditorInit"
+    :options="editorOptions"
+  ></tiny-fluent-editor>
 </template>
 
 <script>
diff --git a/examples/sites/demos/pc/app/fluent-editor/data-switch-composition-api.vue b/examples/sites/demos/pc/app/fluent-editor/data-switch-composition-api.vue
index aa93d608d5..178c5c0293 100644
--- a/examples/sites/demos/pc/app/fluent-editor/data-switch-composition-api.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/data-switch-composition-api.vue
@@ -1,9 +1,5 @@
 <template>
-  <div>
-    <tiny-fluent-editor v-model="value" :data-type="false" :data-upgrade="false"></tiny-fluent-editor>
-    内容：<br />
-    {{ value }}
-  </div>
+  <tiny-fluent-editor v-model="value" :data-type="false" :data-upgrade="false"></tiny-fluent-editor>
 </template>
 
 <script setup>
diff --git a/examples/sites/demos/pc/app/fluent-editor/data-switch.vue b/examples/sites/demos/pc/app/fluent-editor/data-switch.vue
index fddc399be2..9417a45325 100644
--- a/examples/sites/demos/pc/app/fluent-editor/data-switch.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/data-switch.vue
@@ -1,9 +1,5 @@
 <template>
-  <div>
-    <tiny-fluent-editor v-model="value" :data-type="false" :data-upgrade="false"></tiny-fluent-editor>
-    内容：<br />
-    {{ value }}
-  </div>
+  <tiny-fluent-editor v-model="value" :data-type="false" :data-upgrade="false"></tiny-fluent-editor>
 </template>
 
 <script>
diff --git a/examples/sites/demos/pc/app/fluent-editor/disabled-composition-api.vue b/examples/sites/demos/pc/app/fluent-editor/disabled-composition-api.vue
index aba7fe8f27..bb5283f370 100644
--- a/examples/sites/demos/pc/app/fluent-editor/disabled-composition-api.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/disabled-composition-api.vue
@@ -1,7 +1,5 @@
 <template>
-  <div>
-    <tiny-fluent-editor v-model="content" disabled></tiny-fluent-editor>
-  </div>
+  <tiny-fluent-editor v-model="content" disabled></tiny-fluent-editor>
 </template>
 
 <script setup>
diff --git a/examples/sites/demos/pc/app/fluent-editor/disabled.vue b/examples/sites/demos/pc/app/fluent-editor/disabled.vue
index 401368af40..a9013c6c68 100644
--- a/examples/sites/demos/pc/app/fluent-editor/disabled.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/disabled.vue
@@ -1,7 +1,5 @@
 <template>
-  <div>
-    <tiny-fluent-editor v-model="content" disabled></tiny-fluent-editor>
-  </div>
+  <tiny-fluent-editor v-model="content" disabled></tiny-fluent-editor>
 </template>
 
 <script>
diff --git a/examples/sites/demos/pc/app/fluent-editor/image-upload-composition-api.vue b/examples/sites/demos/pc/app/fluent-editor/image-upload-composition-api.vue
index e4663e7257..48f69b6120 100644
--- a/examples/sites/demos/pc/app/fluent-editor/image-upload-composition-api.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/image-upload-composition-api.vue
@@ -1,9 +1,5 @@
 <template>
-  <div>
-    <tiny-fluent-editor v-model="content" :image-upload="imageUpload"></tiny-fluent-editor>
-    内容：<br />
-    {{ content }}
-  </div>
+  <tiny-fluent-editor v-model="content" :image-upload="imageUpload"></tiny-fluent-editor>
 </template>
 
 <script setup>
diff --git a/examples/sites/demos/pc/app/fluent-editor/image-upload.vue b/examples/sites/demos/pc/app/fluent-editor/image-upload.vue
index 39d0d5ec79..27a2b18703 100644
--- a/examples/sites/demos/pc/app/fluent-editor/image-upload.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/image-upload.vue
@@ -1,9 +1,5 @@
 <template>
-  <div>
-    <tiny-fluent-editor v-model="content" :image-upload="imageUpload"></tiny-fluent-editor>
-    内容：<br />
-    {{ content }}
-  </div>
+  <tiny-fluent-editor v-model="content" :image-upload="imageUpload"></tiny-fluent-editor>
 </template>
 
 <script>
diff --git a/examples/sites/demos/pc/app/fluent-editor/options-composition-api.vue b/examples/sites/demos/pc/app/fluent-editor/options-composition-api.vue
index e9b9d695e6..f612d8acb3 100644
--- a/examples/sites/demos/pc/app/fluent-editor/options-composition-api.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/options-composition-api.vue
@@ -1,9 +1,5 @@
 <template>
-  <div>
-    <tiny-fluent-editor v-model="content" :options="options"></tiny-fluent-editor>
-    内容：<br />
-    {{ content }}
-  </div>
+  <tiny-fluent-editor v-model="content" :options="options"></tiny-fluent-editor>
 </template>
 
 <script setup>
diff --git a/examples/sites/demos/pc/app/fluent-editor/options.vue b/examples/sites/demos/pc/app/fluent-editor/options.vue
index d11c19854e..cabdd6639e 100644
--- a/examples/sites/demos/pc/app/fluent-editor/options.vue
+++ b/examples/sites/demos/pc/app/fluent-editor/options.vue
@@ -1,9 +1,5 @@
 <template>
-  <div>
-    <tiny-fluent-editor v-model="content" :options="options"></tiny-fluent-editor>
-    内容：<br />
-    {{ content }}
-  </div>
+  <tiny-fluent-editor v-model="content" :options="options"></tiny-fluent-editor>
 </template>
 
 <script>