MarkdownEditor

Markdown editor with toolbar shortcuts and optional live preview. Stores plain Markdown text.

use NyonCode\WireForms\Components\MarkdownEditor;

Basic Usage

MarkdownEditor::make('description')
    ->minHeight(300)

With Preview Tab

MarkdownEditor::make('content')
    ->withPreview()    // default — adds a Write / Preview tab switcher

Side-by-Side Preview

MarkdownEditor::make('article')
    ->livePreview()    // editor and preview rendered side by side

Without Preview

MarkdownEditor::make('notes')
    ->withPreview(false)

Character Limit

MarkdownEditor::make('bio')
    ->maxLength(500)   // shows a counter and enforces the limit

Toolbar Shortcuts

The toolbar provides keyboard-accessible buttons for:

Preview Rendering

The built-in preview handles: headings (#, ##, ###), bold/italic/strikethrough, inline code, links, blockquotes, and unordered/ordered lists. For full GFM rendering, post-process the stored Markdown on the server side using a library like CommonMark.

The preview runs in the browser and writes through x-html, so raw HTML in the Markdown is escaped, not rendered: <img src=x onerror=…> shows as text. Link URLs are additionally restricted to http(s):, mailto:, # and root-relative paths — anything else becomes #, so a javascript: link cannot be planted through the preview.

Localization

Toolbar tooltips and the Write/Preview tab labels come from the shared editor vocabulary wire-forms::fields.editor.* — the same keys TiptapEditor and RichEditor use, so the three editors read alike in every locale. English (en) and Czech (cs) ship with the package; a Czech app shows Tučné, Kód v textu, and the tabs Psát / Náhled.

Reword a string, or add a locale, by publishing the translations and editing lang/vendor/wire-forms/{locale}/fields.php:

php artisan vendor:publish --tag=wire-forms::translations

Methods

See Common Field API for label, hint, tooltip, and other shared methods.