mjeditor/dist/types/index.d.ts

A modern, plugin-extensible rich text editor for React with beautiful custom dialogs, notification system, and comprehensive editing features. Built with Slate.js for maximum flexibility.

import { ReactNode } from 'react';
import { BaseEditor, BaseRange, BaseSelection, BaseElement, BaseText } from 'slate';
import { ReactEditor } from 'slate-react';
import { HistoryEditor } from 'slate-history';
declare module 'slate' {
    interface CustomTypes {
        Editor: CustomEditor;
        Element: CustomElement;
        Text: CustomText;
    }
}
export type CustomEditor = BaseEditor & ReactEditor & HistoryEditor;
export type CustomElement = ParagraphElement | HeadingElement | ListItemElement | BulletedListElement | NumberedListElement | ImageElement | TableElement | TableRowElement | TableCellElement | CodeBlockElement | HorizontalRuleElement | ChecklistElement;
export type CustomText = BaseText & {
    bold?: boolean;
    italic?: boolean;
    underline?: boolean;
    strikethrough?: boolean;
    color?: string;
    backgroundColor?: string;
    fontSize?: number;
    fontFamily?: string;
    superscript?: boolean;
    subscript?: boolean;
    link?: string;
};
export interface ParagraphElement extends BaseElement {
    type: 'paragraph';
    align?: 'left' | 'center' | 'right' | 'justify';
    indent?: number;
    children: CustomText[];
}
export interface HeadingElement extends BaseElement {
    type: 'heading';
    level: 1 | 2 | 3 | 4 | 5 | 6;
    align?: 'left' | 'center' | 'right' | 'justify';
    children: CustomText[];
}
export interface ListItemElement extends BaseElement {
    type: 'list-item';
    children: CustomText[];
}
export interface BulletedListElement extends BaseElement {
    type: 'bulleted-list';
    children: ListItemElement[];
}
export interface NumberedListElement extends BaseElement {
    type: 'numbered-list';
    children: ListItemElement[];
}
export interface ImageElement extends BaseElement {
    type: 'image';
    url: string;
    alt?: string;
    caption?: string;
    align?: 'left' | 'center' | 'right';
    width?: number;
    height?: number;
    children: CustomText[];
}
export interface TableElement extends BaseElement {
    type: 'table';
    rows: number;
    cols: number;
    children: TableRowElement[];
}
export interface TableRowElement extends BaseElement {
    type: 'table-row';
    children: TableCellElement[];
}
export interface TableCellElement extends BaseElement {
    type: 'table-cell';
    header?: boolean;
    align?: 'left' | 'center' | 'right';
    children: CustomText[];
}
export interface CodeBlockElement extends BaseElement {
    type: 'code-block';
    language?: string;
    children: CustomText[];
}
export interface HorizontalRuleElement extends BaseElement {
    type: 'horizontal-rule';
    style?: 'solid' | 'dashed' | 'dotted';
    thickness?: number;
    color?: string;
    children: CustomText[];
}
export interface ChecklistElement extends BaseElement {
    type: 'checklist';
    checked: boolean;
    children: CustomText[];
}
export interface Plugin {
    name: string;
    renderElement?: (props: any) => ReactNode | undefined;
    renderLeaf?: (props: any) => ReactNode | undefined;
    onKeyDown?: (event: KeyboardEvent, editor: CustomEditor) => boolean;
    toolbarButton?: () => ReactNode;
    commands?: Record<string, (editor: CustomEditor, ...args: any[]) => void>;
}
export interface MJEditorProps {
    value?: CustomElement[];
    onChange?: (value: CustomElement[]) => void;
    placeholder?: string;
    readOnly?: boolean;
    plugins?: Plugin[];
    theme?: 'light' | 'dark';
    className?: string;
    style?: React.CSSProperties;
    autoFocus?: boolean;
    autoSave?: boolean;
    autoSaveInterval?: number;
    onSave?: (value: CustomElement[]) => void;
    toolbarConfig?: ToolbarConfig;
    maxLength?: number;
    minHeight?: string;
    maxHeight?: string;
}
export interface ToolbarConfig {
    showTextFormatting?: boolean;
    showFontControls?: boolean;
    showTextStyling?: boolean;
    showTextAlignment?: boolean;
    showIndentation?: boolean;
    showLists?: boolean;
    showTextPositioning?: boolean;
    showInsertOptions?: boolean;
    showAdvancedFeatures?: boolean;
    showUndoRedo?: boolean;
    disabledTools?: string[];
    customButtons?: ReactNode[];
}
export interface ColorOption {
    name: string;
    value: string;
    label: string;
}
export interface FontOption {
    name: string;
    value: string;
    label: string;
}
export interface SizeOption {
    name: string;
    value: number;
    label: string;
}
export interface ExportOptions {
    format: 'html' | 'markdown' | 'plain-text' | 'json';
    includeStyles?: boolean;
    preserveFormatting?: boolean;
}
export interface HistoryState {
    undos: any[];
    redos: any[];
}
export type CustomSelection = BaseSelection;
export type CustomRange = BaseRange;
export type ElementType = CustomElement['type'];
export type MarkType = keyof Omit<CustomText, 'text'>;
export interface EditorEvent {
    type: string;
    data?: any;
    timestamp: number;
}
export interface EditorConfig {
    plugins: Plugin[];
    theme: 'light' | 'dark';
    toolbar: ToolbarConfig;
    autoSave: boolean;
    autoSaveInterval: number;
    maxLength?: number;
    placeholder?: string;
}
export declare const DEFAULT_FONTS: FontOption[];
export declare const DEFAULT_SIZES: SizeOption[];
export declare const DEFAULT_COLORS: ColorOption[];
export declare const DEFAULT_HIGHLIGHT_COLORS: ColorOption[];
//# sourceMappingURL=index.d.ts.map