tiptap-extension-resizable
This is a Tiptap extension designed to enable resizing for your Tiptap content, including elements such as images and videos
Tnstall
npm install tiptap-extension-resizable -SUsage
import Resizable from "tiptap-extension-resizable";
const editor = new Editor({
element: document.querySelector(".editor"),
extensions: [StarterKit, Image.configure({ inline: true }), Resizable],
});Options
You can configure extension options, which are optional.
extensions: [
StarterKit,
Image.configure({ inline: true }),
Resizable.configure({
types: ["image", "video"], // resizable type
handlerStyle: { // handler point style
width: "8px",
height: "8px",
background: "#07c160",
},
layerStyle: { // layer mask style
border: "2px solid #07c160",
},
}),
],Relations
@tiptap/extension-image: https://github.com/ueberdosis/tiptap/tree/develop/packages/extension-image
tiptap-appmsg-editor: https://github.com/KID-1912/tiptap-appmsg-editor