From 8830fe3c9c73a7b26e6314ef46f59add35379906 Mon Sep 17 00:00:00 2001
From: yikoyu <2282373181@qq.com>
Date: Sat, 27 Jan 2024 12:22:22 +0800
Subject: [PATCH] refactor(VuetifyTiptap): override configurations for
 duplicate extensions, update tsconfig

---
 examples/App.vue                 | 14 ++++++++++++--
 examples/extensions/preview.ts   |  6 ++----
 src/components/VuetifyTiptap.vue | 15 ++++++++++++---
 src/utils/utils.ts               |  2 +-
 tsconfig.json                    |  3 +--
 5 files changed, 28 insertions(+), 12 deletions(-)

diff --git a/examples/App.vue b/examples/App.vue
index 50dadd5..35eb170 100644
--- a/examples/App.vue
+++ b/examples/App.vue
@@ -7,14 +7,24 @@
 <script setup lang="ts">
 import { computed, ref, unref } from 'vue'
 import { useTheme } from 'vuetify'
-import { locale, type VuetifyTiptapOnChange } from 'vuetify-pro-tiptap'
+import { BaseKit, Heading, locale, type VuetifyTiptapOnChange } from 'vuetify-pro-tiptap'
 import JsonEditorVue from 'json-editor-vue'
 
 import CustomLang from './components/CustomLang.vue'
 import preview from './extensions/preview'
 import { jsonValue } from './html'
 
-const extensions = [preview.configure({ spacer: true })]
+const extensions = [
+  preview.configure({ spacer: true }),
+  BaseKit.configure({
+    placeholder: {
+      placeholder: 'Placeholder...'
+    }
+  }),
+  Heading.configure({
+    levels: [1, 2, 3, 4]
+  })
+]
 
 const theme = useTheme()
 
diff --git a/examples/extensions/preview.ts b/examples/extensions/preview.ts
index eab99da..aece699 100644
--- a/examples/extensions/preview.ts
+++ b/examples/extensions/preview.ts
@@ -1,11 +1,9 @@
-import type { ButtonView, GeneralOptions } from 'vuetify-pro-tiptap'
+import type { GeneralOptions } from 'vuetify-pro-tiptap'
 import { Extension } from '@tiptap/core'
 
 import PreviewActionButton from '../components/PreviewActionButton.vue'
 
-export interface PreviewOptions extends GeneralOptions {
-  button: ButtonView
-}
+export type PreviewOptions = GeneralOptions<PreviewOptions>
 
 export default Extension.create<PreviewOptions>({
   name: 'preview',
diff --git a/src/components/VuetifyTiptap.vue b/src/components/VuetifyTiptap.vue
index ad5ee8e..f5c37d3 100644
--- a/src/components/VuetifyTiptap.vue
+++ b/src/components/VuetifyTiptap.vue
@@ -12,7 +12,7 @@ import { EDITOR_UPDATE_THROTTLE_WAIT_TIME, EDITOR_UPDATE_WATCH_THROTTLE_WAIT_TIM
 import { useMarkdownTheme, useProvideTiptapStore } from '@/hooks'
 import { useLocale } from '@/locales'
 import { VuetifyTiptapOnChange } from '@/type'
-import { getUnitWithPxAsDefault, hasExtension, isBoolean, isEqual, throttle } from '@/utils/utils'
+import { differenceBy, getUnitWithPxAsDefault, hasExtension, isBoolean, isEqual, throttle } from '@/utils/utils'
 
 type HandleKeyDown = NonNullable<EditorOptions['editorProps']['handleKeyDown']>
 type OnUpdate = NonNullable<EditorOptions['onUpdate']>
@@ -81,8 +81,17 @@ const { markdownThemeStyle } = useMarkdownTheme(
 )
 
 const sortExtensions = computed<AnyExtension[]>(() => {
-  const exts = [...state.extensions, ...props.extensions]
-  return exts.map((k, i) => k.configure({ sort: i }))
+  const diff = differenceBy(props.extensions, state.extensions, 'name')
+
+  // Override configurations for duplicate extensions
+  const exts = state.extensions.map((k, i) => {
+    const find = props.extensions.find(ext => ext.name === k.name)
+    if (!find) return k
+
+    return k.configure(find.options)
+  })
+
+  return [...exts, ...diff].map((k, i) => k.configure({ sort: i }))
 })
 
 const editor = new Editor({
diff --git a/src/utils/utils.ts b/src/utils/utils.ts
index 7a8beb6..8b93f07 100644
--- a/src/utils/utils.ts
+++ b/src/utils/utils.ts
@@ -44,4 +44,4 @@ export function hasExtension(editor: Editor, name: string): boolean {
   return true
 }
 
-export { isEqual, throttle } from 'lodash-unified'
+export { differenceBy, isEqual, throttle } from 'lodash-unified'
diff --git a/tsconfig.json b/tsconfig.json
index 290d009..6614f8c 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -14,8 +14,7 @@
     "types": ["vite/client", "vuetify"],
     "lib": ["esnext", "dom"],
     "paths": {
-      "@/*":["./src/*"],
-      "*": ["./node_modules/*"]
+      "@/*":["./src/*"]
     }
   },
   "vueCompilerOptions": {