editcrafter
Version:
To use **EditCrafter** with Tailwind CSS, you need to set up Tailwind CSS in your project. Here's a step-by-step guide to help you integrate Tailwind CSS and customize your `tailwind.config.js` file for use with **EditCrafter**.
53 lines (52 loc) • 2.01 kB
TypeScript
import { ImageOptions } from '@tiptap/extension-image';
import { Attrs } from '@tiptap/pm/model';
import { Editor } from '@tiptap/react';
import { FileError, FileValidationOptions } from '../../utils';
type ImageAction = 'download' | 'copyImage' | 'copyLink';
interface DownloadImageCommandProps {
src: string;
alt?: string;
}
interface ImageActionProps extends DownloadImageCommandProps {
action: ImageAction;
}
export type UploadReturnType = string | {
id: string | number;
src: string;
};
interface CustomImageOptions extends ImageOptions, Omit<FileValidationOptions, 'allowBase64'> {
uploadFn?: (file: File, editor: Editor) => Promise<UploadReturnType>;
onImageRemoved?: (props: Attrs) => void;
onActionSuccess?: (props: ImageActionProps) => void;
onActionError?: (error: Error, props: ImageActionProps) => void;
downloadImage?: (props: ImageActionProps, options: CustomImageOptions) => Promise<void>;
copyImage?: (props: ImageActionProps, options: CustomImageOptions) => Promise<void>;
copyLink?: (props: ImageActionProps, options: CustomImageOptions) => Promise<void>;
onValidationError?: (errors: FileError[]) => void;
onToggle?: (editor: Editor, files: File[], pos: number) => void;
}
declare module '@tiptap/react' {
interface Commands<ReturnType> {
setImages: {
setImages: (attrs: {
src: string | File;
alt?: string;
title?: string;
}[]) => ReturnType;
};
downloadImage: {
downloadImage: (attrs: DownloadImageCommandProps) => ReturnType;
};
copyImage: {
copyImage: (attrs: DownloadImageCommandProps) => ReturnType;
};
copyLink: {
copyLink: (attrs: DownloadImageCommandProps) => ReturnType;
};
toggleImage: {
toggleImage: () => ReturnType;
};
}
}
export declare const Image: import('@tiptap/core').Node<CustomImageOptions, any>;
export {};