MyST Editor Component Demo

This page demonstrates the wa-myst-editor web component, which provides a live MyST markdown editor with real-time preview.

Basic Usage

The component automatically processes MyST markdown and displays a live preview using the MyST parser and basic transformations.

Properties

The wa-myst-editor component supports the following properties:

  • value - The MyST markdown content
  • placeholder - Placeholder text for the textarea
  • readonly - Make the editor read-only

Read-only Example

Here's a read-only editor showing MyST syntax:

JavaScript API

The component provides several methods for programmatic control:

  • setValue(content) - Set the editor content
  • getValue() - Get the current content
  • getAst() - Get the parsed MyST AST
  • focus() - Focus the editor