react image resize extension for tiptap
npm install tiptap-react-image-resizenpm i tiptap-react-image-resize
yarn add tiptap-react-image-resize
it's a npm package for tiptap-react extension
resized by onMouseDown and onMouseMove event
``tsx
export const EditorDemo = () => {
const editor = useEditor({
extensions: [
Document,
Text,
ImageSizeExtension.configure({
maxWidth: "800px",
}),
],
content:
,`
});
return (
);
};
`typescriptinline-block
export interface ImageSizeExtensionOptions {
// image min width
minWidth: string | number;
// image max width & loader default width
maxWidth: string | number;
// border color when selected
activeBorderColor: string;
// image size level, default set to [300, 600, 900]
levels: [number, number, number] | [number, number];
// display or block, default to false``
display: 'inline-block' | 'block';
allowBase64: boolean;
HTMLAttributes: Record
}
if it's helpful for you, please give me a star !