fix: tinymce

apps/web-antd/package.json

@@ -50,6 +50,7 @@
     "dayjs": "catalog:",
     "highlight.js": "catalog:",
     "pinia": "catalog:",
+    "tinymce": "catalog:",
     "vue": "catalog:",
     "vue-dompurify-html": "catalog:",
     "vue-router": "catalog:",

apps/web-antd/src/components/tinymce/editor.vue

@@ -2,8 +2,6 @@
 import type { IPropTypes } from '@tinymce/tinymce-vue/lib/cjs/main/ts/components/EditorPropTypes';
 import type { Editor as EditorType } from 'tinymce/tinymce';
 
-import type { PropType } from 'vue';
-
 import {
   computed,
   nextTick,
@@ -35,37 +33,26 @@ type InitOptions = IPropTypes['init'];
 
 defineOptions({ name: 'Tinymce', inheritAttrs: false });
 
-const props = defineProps({
+const props = withDefaults(defineProps<TinymacProps>(), {
-  options: {
+  height: 400,
-    type: Object as PropType<Partial<InitOptions>>,
+  width: 'auto',
-    default: () => ({}),
+  options: () => ({}),
-  },
+  plugins: defaultPlugins,
-  toolbar: {
+  toolbar: defaultToolbar,
-    type: String,
+  showImageUpload: true,
-    default: defaultToolbar,
-  },
-  plugins: {
-    type: String,
-    default: defaultPlugins,
-  },
-  height: {
-    type: [Number, String] as PropType<number | string>,
-    required: false,
-    default: 400,
-  },
-  width: {
-    type: [Number, String] as PropType<number | string>,
-    required: false,
-    default: 'auto',
-  },
-  showImageUpload: {
-    type: Boolean,
-    default: true,
-  },
 });
 
 const emit = defineEmits(['change']);
 
+interface TinymacProps {
+  options?: Partial<InitOptions>;
+  toolbar?: string;
+  plugins?: string;
+  height?: number | string;
+  width?: number | string;
+  showImageUpload?: boolean;
+}
+
 /** 外部使用 v-model 绑定值 */
 const modelValue = defineModel('modelValue', { default: '', type: String });
 
@@ -151,7 +138,7 @@ const initOptions = computed((): InitOptions => {
       'bold italic | quicklink h2 h3 blockquote quickimage quicktable',
     toolbar_mode: 'sliding',
     ...options,
-    images_upload_handler: (blobInfo) => {
+    images_upload_handler: (blobInfo: any) => {
       return new Promise((resolve, reject) => {
         const file = blobInfo.blob() as File;
         const { httpRequest } = useUpload();
@@ -165,9 +152,9 @@ const initOptions = computed((): InitOptions => {
           });
       });
     },
-    setup: (editor) => {
+    setup: (editor: EditorType) => {
       editorRef.value = editor;
-      editor.on('init', (e) => initSetup(e));
+      editor.on('init', (e: any) => initSetup(e));
     },
   };
 });

pnpm-lock.yaml

@@ -495,6 +495,9 @@ catalogs:
     theme-colors:
       specifier: ^0.1.0
       version: 0.1.0
+    tinymce:
+      specifier: ^7.3.0
+      version: 7.9.1
     tippy.js:
       specifier: ^6.3.7
       version: 6.3.7
@@ -724,7 +727,7 @@ importers:
         version: 3.3.0(vue@3.5.18(typescript@5.9.2))
       '@tinymce/tinymce-vue':
         specifier: 'catalog:'
-        version: 6.3.0(vue@3.5.18(typescript@5.9.2))
+        version: 6.3.0(tinymce@7.9.1)(vue@3.5.18(typescript@5.9.2))
       '@vben/access':
         specifier: workspace:*
         version: link:../../packages/effects/access
@@ -788,6 +791,9 @@ importers:
       pinia:
         specifier: ^3.0.3
         version: 3.0.3(typescript@5.9.2)(vue@3.5.18(typescript@5.9.2))
+      tinymce:
+        specifier: 'catalog:'
+        version: 7.9.1
       vue:
         specifier: ^3.5.17
         version: 3.5.18(typescript@5.9.2)
@@ -811,7 +817,7 @@ importers:
         version: 3.2.28(vue@3.5.18(typescript@5.9.2))
       '@tinymce/tinymce-vue':
         specifier: 'catalog:'
-        version: 6.3.0(vue@3.5.18(typescript@5.9.2))
+        version: 6.3.0(tinymce@7.9.1)(vue@3.5.18(typescript@5.9.2))
       '@vben/access':
         specifier: workspace:*
         version: link:../../packages/effects/access
@@ -10774,6 +10780,9 @@ packages:
     resolution: {integrity: sha512-tX5e7OM1HnYr2+a2C/4V0htOcSQcoSTH9KgJnVvNm5zm/cyEWKJ7j7YutsH9CxMdtOkkLFy2AHrMci9IM8IPZQ==}
     engines: {node: '>=12.0.0'}
 
+  tinymce@7.9.1:
+    resolution: {integrity: sha512-zaOHwmiP1EqTeLRXAvVriDb00JYnfEjWGPdKEuac7MiZJ5aiDMZ4Unc98Gmajn+PBljOmO1GKV6G0KwWn3+k8A==}
+
   tinypool@1.1.1:
     resolution: {integrity: sha512-Zba82s87IFq9A9XmjiX5uZA/ARWDrB03OHlq+Vw1fSdt0I+4/Kutwy8BP4Y/y/aORMo61FQ0vIb5j44vSo5Pkg==}
     engines: {node: ^18.0.0 || >=20.0.0}
@@ -14692,9 +14701,11 @@ snapshots:
       '@tanstack/virtual-core': 3.13.12
       vue: 3.5.18(typescript@5.9.2)
 
-  '@tinymce/tinymce-vue@6.3.0(vue@3.5.18(typescript@5.9.2))':
+  '@tinymce/tinymce-vue@6.3.0(tinymce@7.9.1)(vue@3.5.18(typescript@5.9.2))':
     dependencies:
       vue: 3.5.18(typescript@5.9.2)
+    optionalDependencies:
+      tinymce: 7.9.1
 
   '@tootallnate/once@1.1.2': {}
 
@@ -21446,6 +21457,8 @@ snapshots:
       fdir: 6.5.0(picomatch@4.0.3)
       picomatch: 4.0.3
 
+  tinymce@7.9.1: {}
+
   tinypool@1.1.1: {}
 
   tinyrainbow@2.0.0: {}

pnpm-workspace.yaml

@@ -182,6 +182,7 @@ catalog:
   tailwindcss-animate: ^1.0.7
   theme-colors: ^0.1.0
   tippy.js: ^6.3.7
+  tinymce: ^7.3.0
   turbo: ^2.5.4
   typescript: ^5.8.3
   unbuild: ^3.6.1