Basic Usage #

import { Marzipan } from '@pinkpixel/marzipan';

const [editor] = new Marzipan('#my-textarea', {
  placeholder: 'Start typing...',
  toolbar: true,
});

// Get current content
const content = editor.getValue();

// Set new content
editor.setValue('# New Content\n\nHello world!');

// Get rendered HTML (with Marzipan classes)
const html = editor.getRenderedHTML();

// Get clean HTML (no Marzipan markup)
const cleanHtml = editor.getCleanHTML();

// Toggle between edit and preview modes
editor.showPreviewMode(true);  // Preview only
editor.showPreviewMode(false); // Edit mode

// Show/hide plain textarea (no overlay)
editor.showPlainTextarea(true);  // Plain textarea
editor.showPlainTextarea(false); // Overlay preview

// Show stats panel
editor.showStats(true);

// Custom stats formatter
new Marzipan('#editor', {
  showStats: true,
  statsFormatter: ({ words, chars, lines, line, column }) => {
    return `${words} words • ${chars} chars • Line ${line}:${column}`;
  }
});