Vizel API / core/src / createVizelFileHandlerExtension

Function: createVizelFileHandlerExtension()

function createVizelFileHandlerExtension(options?): Extension<Omit<FileHandlePluginOptions, "editor" | "key">, any>;

Defined in: packages/core/src/extensions/file-handler.ts:135

Create a file handler extension with unified drop/paste handling.

This extension uses @tiptap/extension-file-handler to provide consistent file handling across paste and drop operations.

Parameters

Parameter	Type
options	VizelFileHandlerOptions

Returns

Extension<Omit<FileHandlePluginOptions, "editor" | "key">, any>

Examples

Basic usage with image upload

const extensions = [
  ...createVizelExtensions(),
  createVizelFileHandlerExtension({
    onDrop: (editor, files, pos) => {
      files.forEach(file => {
        // Handle dropped file (e.g., upload image)
        uploadImage(file).then(url => {
          editor.chain().focus().setImage({ src: url }).run();
        });
      });
    },
    onPaste: (editor, files) => {
      files.forEach(file => {
        // Handle pasted file
        uploadImage(file).then(url => {
          editor.chain().focus().setImage({ src: url }).run();
        });
      });
    },
  }),
];

With custom MIME types

createVizelFileHandlerExtension({
  allowedMimeTypes: ['image/*', 'application/pdf'],
  onDrop: (editor, files, pos) => { ... },
  onPaste: (editor, files) => { ... },
});