From c96df9f7868cf8bcc59e14d5b35fb67dd717459a Mon Sep 17 00:00:00 2001
From: wuyiping0628 <1106773985@qq.com>
Date: Thu, 6 Aug 2026 06:16:54 -0700
Subject: [PATCH 1/2] feat: fix the issue of failed title switching after using
 the quill-header-list plugin

---
 packages/docs/fluent-editor/demos/header-list-container.vue | 3 +++
 packages/docs/fluent-editor/demos/header-list.vue           | 3 +++
 2 files changed, 6 insertions(+)

diff --git a/packages/docs/fluent-editor/demos/header-list-container.vue b/packages/docs/fluent-editor/demos/header-list-container.vue
index 7483d8c3..55a47885 100644
--- a/packages/docs/fluent-editor/demos/header-list-container.vue
+++ b/packages/docs/fluent-editor/demos/header-list-container.vue
@@ -26,6 +26,9 @@ onMounted(async () => {
           [{ header: [null, 1, 2, 3, 4, 5, 6] }, 'header-list'],
         ],
         handlers: {
+          header(value: string | false) {
+            this.quill.format('header', value === false ? false : Number(value))
+          },
           'header-list': HeaderList.toolbarHandle,
         },
       },
diff --git a/packages/docs/fluent-editor/demos/header-list.vue b/packages/docs/fluent-editor/demos/header-list.vue
index b52082ea..1be550f4 100644
--- a/packages/docs/fluent-editor/demos/header-list.vue
+++ b/packages/docs/fluent-editor/demos/header-list.vue
@@ -26,6 +26,9 @@ onMounted(async () => {
           [{ header: [false, 1, 2, 3, 4, 5, 6] }, 'header-list'],
         ],
         handlers: {
+          header(value: string | false) {
+            this.quill.format('header', value === false ? false : Number(value))
+          },
           'header-list': HeaderList.toolbarHandle,
         },
       },

From 7390e8568a7b476124291f78265d8b2b10e65eb6 Mon Sep 17 00:00:00 2001
From: wuyiping0628 <1106773985@qq.com>
Date: Tue, 11 Aug 2026 06:14:21 -0700
Subject: [PATCH 2/2] feat: fix the issue of failed title switching after using
 the quill-header-list plugin

---
 .../docs/fluent-editor/demos/header-list-container.vue    | 8 ++++++--
 packages/docs/fluent-editor/demos/header-list.vue         | 7 ++++++-
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/packages/docs/fluent-editor/demos/header-list-container.vue b/packages/docs/fluent-editor/demos/header-list-container.vue
index 55a47885..3b9cf8a9 100644
--- a/packages/docs/fluent-editor/demos/header-list-container.vue
+++ b/packages/docs/fluent-editor/demos/header-list-container.vue
@@ -8,8 +8,10 @@ const editorRef = ref<HTMLElement>()
 const headerListRef = ref<HTMLElement>()
 
 onMounted(async () => {
-  // ssr compat, reference: https://vitepress.dev/guide/ssr-compat#importing-in-mounted-hook
-  const [{ default: FluentEditor, DEFAULT_TOOLBAR }, { default: HeaderList }] = await Promise.all([
+  const [
+    { default: FluentEditor, DEFAULT_TOOLBAR },
+    { default: HeaderList, HeaderWithID },
+  ] = await Promise.all([
     import('@opentiny/fluent-editor'),
     import('quill-header-list'),
   ])
@@ -17,6 +19,8 @@ onMounted(async () => {
   if (!editorRef.value) return
   FluentEditor.register({ 'modules/header-list': HeaderList }, true)
 
+  HeaderWithID.idKey = 'id'
+
   editor = new FluentEditor(editorRef.value, {
     theme: 'snow',
     modules: {
diff --git a/packages/docs/fluent-editor/demos/header-list.vue b/packages/docs/fluent-editor/demos/header-list.vue
index 1be550f4..1ae5a932 100644
--- a/packages/docs/fluent-editor/demos/header-list.vue
+++ b/packages/docs/fluent-editor/demos/header-list.vue
@@ -9,7 +9,10 @@ const headerListRef = ref<HTMLElement>()
 
 onMounted(async () => {
   // ssr compat, reference: https://vitepress.dev/guide/ssr-compat#importing-in-mounted-hook
-  const [{ default: FluentEditor, DEFAULT_TOOLBAR }, { default: HeaderList }] = await Promise.all([
+  const [
+    { default: FluentEditor, DEFAULT_TOOLBAR },
+    { default: HeaderList, HeaderWithID },
+  ] = await Promise.all([
     import('@opentiny/fluent-editor'),
     import('quill-header-list'),
   ])
@@ -17,6 +20,8 @@ onMounted(async () => {
   if (!editorRef.value) return
   FluentEditor.register({ 'modules/header-list': HeaderList }, true)
 
+  HeaderWithID.idKey = 'id'
+
   editor = new FluentEditor(editorRef.value, {
     theme: 'snow',
     modules: {