fix small block

resources/js/components/SMEditor.vue

@@ -659,7 +659,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onBeforeUnmount, watch } from "vue";
+import { onBeforeUnmount, watch } from "vue";
 import { useEditor, EditorContent, BubbleMenu, isActive } from "@tiptap/vue-3";
 import StarterKit from "@tiptap/starter-kit";
 import Underline from "@tiptap/extension-underline";
@@ -676,7 +676,7 @@ import Image from "@tiptap/extension-image";
 import { Small } from "../extensions/small";
 import { openDialog } from "./SMDialog";
 import SMDialogMedia from "./dialogs/SMDialogMedia.vue";
-import { Media, MediaCollection, MediaResponse } from "../helpers/api.types";
+import { Media, MediaCollection } from "../helpers/api.types";
 import { api } from "../helpers/api";
 import { extractFileNameFromUrl } from "../helpers/url";
 import { mediaGetVariantUrl } from "../helpers/media";

resources/js/extensions/small.ts

@@ -1,16 +1,19 @@
-import { Node } from "@tiptap/core";
+import { mergeAttributes, Node } from "@tiptap/core";
 
 export interface SmallOptions {
-    HTMLAttributes: Record<string, unknown>;
+    HTMLAttributes: Record<string, any>;
 }
 
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
         small: {
             /**
-             * Toggle a paragraph
+             * Set a small mark
              */
             setSmall: () => ReturnType;
+            /**
+             * Toggle a small mark
+             */
             toggleSmall: () => ReturnType;
         };
     }
@@ -20,11 +23,15 @@ export const Small = Node.create<SmallOptions>({
     name: "small",
     group: "block",
     content: "inline*",
-    defining: true,
-    priority: 100,
+
+    addOptions() {
+        return {
+            HTMLAttributes: { class: "small" },
+        };
+    },
 
     parseHTML() {
-        return [{ tag: "p", class: "small", priority: 51 }];
+        return [{ tag: "p.small", priority: 100 }];
     },
 
     renderHTML({ HTMLAttributes }) {
@@ -35,12 +42,6 @@ export const Small = Node.create<SmallOptions>({
         ];
     },
 
-    addOptions() {
-        return {
-            HTMLAttributes: { class: "small" },
-        };
-    },
-
     addCommands() {
         return {
             setSmall:
@@ -56,14 +57,3 @@ export const Small = Node.create<SmallOptions>({
         };
     },
 });
-/**
- *
- * @param HTMLAttributes
- * @param HTMLAttributes1
- */
-function mergeAttributes(
-    HTMLAttributes: Record<string, unknown>,
-    HTMLAttributes1: Record<string, any>,
-): any | string {
-    throw new Error("Function not implemented.");
-}