Editor Core

/**
 * Creates a new Editor.js instance
 * @param configuration - Editor configuration object or holder element ID
 */
constructor(configuration?: EditorConfig | string);

import EditorJS from '@editorjs/editorjs';

// Basic initialization with element ID
const editor = new EditorJS('editorjs');

// Full configuration
const editor = new EditorJS({
  holder: 'editorjs',
  autofocus: true,
  placeholder: 'Start typing...',
  tools: {
    paragraph: {
      class: ParagraphTool,
      inlineToolbar: true
    }
  },
  data: {
    blocks: []
  },
  onReady: () => {
    console.log('Editor.js is ready to work!');
  },
  onChange: (api, event) => {
    console.log('Content changed:', event);
  }
});

/**
 * Current version of Editor.js
 */
static readonly version: string;

console.log('Editor.js version:', EditorJS.version);

/**
 * Promise that resolves when editor is fully initialized and ready to work
 */
readonly isReady: Promise<void>;

const editor = new EditorJS({ holder: 'editorjs' });

// Wait for editor to be ready before performing operations
await editor.isReady;
console.log('Editor is ready');

// Or use promise syntax
editor.isReady.then(() => {
  console.log('Editor is ready');
});

/**
 * Saves current editor data as JSON
 * @returns Promise resolving to OutputData with blocks array
 */
save(): Promise<OutputData>;

/**
 * Renders data from JSON format into editor blocks
 * @param data - OutputData object containing blocks to render
 */
render(data: OutputData): Promise<void>;

/**
 * Removes all blocks from the editor
 */
clear(): void;

// Save editor content
const outputData = await editor.save();
console.log('Saved data:', outputData);
// Output: { version: "2.30.8", time: 1625097600000, blocks: [...] }

// Load content into editor
await editor.render({
  version: "2.30.8",
  time: 1625097600000,
  blocks: [
    {
      type: "paragraph",
      data: {
        text: "Hello World!"
      }
    },
    {
      type: "header",
      data: {
        text: "Chapter 1",
        level: 2
      }
    }
  ]
});

// Clear all content
editor.clear();

/**
 * Sets focus to the editor
 * @param atEnd - If true, places caret at the end of the last block
 * @returns true if focus was successfully set
 */
focus(atEnd?: boolean): boolean;

// Focus at beginning of editor
editor.focus();

// Focus at end of editor content
editor.focus(true);

// Check if focus was successful
const focused = editor.focus();
if (!focused) {
  console.log('Failed to focus editor');
}

/**
 * Subscribe to editor event
 * @param eventName - Name of the event to listen for
 * @param callback - Function to call when event is triggered
 */
on(eventName: string, callback: (data?: any) => void): void;

/**
 * Unsubscribe from editor event
 * @param eventName - Name of the event to stop listening for
 * @param callback - Function to remove from event listeners
 */
off(eventName: string, callback: (data?: any) => void): void;

/**
 * Trigger editor event
 * @param eventName - Name of the event to emit
 * @param data - Data to pass to event listeners
 */
emit(eventName: string, data: any): void;

// Subscribe to block added event
const onBlockAdded = (event) => {
  console.log('Block added:', event.detail);
};
editor.on('block-added', onBlockAdded);

// Unsubscribe from event
editor.off('block-added', onBlockAdded);

// Emit custom event
editor.emit('custom-event', { message: 'Hello from editor' });

// Listen for common events
editor.on('block-changed', (event) => {
  console.log('Block changed:', event);
});

editor.on('block-removed', (event) => {
  console.log('Block removed:', event);
});

/**
 * Destroy editor instance and clean up all resources
 * Removes DOM elements, event listeners, and frees memory
 */
destroy(): void;

// Clean up editor when no longer needed
editor.destroy();

// Typical usage in frameworks
useEffect(() => {
  const editor = new EditorJS({ holder: 'editorjs' });
  
  return () => {
    // Cleanup on component unmount
    editor.destroy();
  };
}, []);

interface EditorConfig {
  holder?: string | HTMLElement;
  autofocus?: boolean;
  defaultBlock?: string;
  initialBlock?: string; // deprecated
  placeholder?: string | false;
  sanitizer?: SanitizerConfig;
  hideToolbar?: boolean;
  tools?: {[toolName: string]: ToolConstructable | ToolSettings};
  data?: OutputData;
  minHeight?: number;
  logLevel?: LogLevels;
  readOnly?: boolean;
  i18n?: I18nConfig;
  onReady?(): void;
  onChange?(api: API, event: BlockMutationEvent | BlockMutationEvent[]): void;
  inlineToolbar?: string[] | boolean;
  tunes?: string[];
  style?: { nonce?: string };
}

interface OutputData {
  version?: string;
  time?: number;
  blocks: OutputBlockData[];
}

interface OutputBlockData<Type extends string = string, Data extends object = any> {
  id?: string;
  type: Type;
  data: BlockToolData<Data>;
  tunes?: {[name: string]: BlockTuneData};
}