markdown-text-editor 1.7.0 → 1.8.0

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2025 nezanuha
+Copyright (c) 2026 nezanuha
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -1,6 +1,6 @@
-# MarkdownEditor — Lightweight JavaScript Markdown Editor with WYSIWYG & Plain Mode
+# Markdown Text Editor
 
-### The Native-First JavaScript Markdown Editor
+### Toolbar, live preview and WYSIWYG on the textarea you already have
 
 [![npm installs][npm_installs]](https://www.npmjs.com/package/markdown-text-editor)
 [![Jsdelivr hits][jsdelivr]](https://cdn.jsdelivr.net/npm/markdown-text-editor)
@@ -13,27 +13,34 @@ A lightweight, embeddable JavaScript Markdown editor that transforms a standard
 
 A native-first Markdown editor built on a standard textarea. No data binding, no API — just drop it in and your forms keep working as-is.
 
+**Works standalone.** No Frutjam, no Tailwind, no framework required, the styles are bundled.
+
+![Hybrid mode: headings, bold text and list markers styled live inside the textarea while the Markdown syntax stays visible](https://cdn.frutjam.com/media/plugins/hybrid-mode-markdown-editor.webp)
+
+<sub>Hybrid mode. Text is styled as you type and the Markdown stays where it is, because this is your `<textarea>`, not a copy of it.</sub>
+
 > **No complex APIs. No data binding. No JSON schemas.** Just a `<textarea>` that types Markdown and submits like any normal form field — enhanced with a rich toolbar, live preview, and WYSIWYG hybrid mode.
 
 ## ⭐ Why developers choose this over EasyMDE / SimpleMDE
 
-Most JavaScript markdown editors (EasyMDE, SimpleMDE, CodeMirror-based editors) replace your `<textarea>` with a custom element — which means you have to write extra code to extract the value before form submission, sync state manually, and learn a new API just to read or set content.
+Most JavaScript markdown editors (EasyMDE, SimpleMDE, CodeMirror-based editors) hide your `<textarea>` and edit a copy, writing the value back when the form is submitted. That holds up until something else needs the field: a `required` input the browser cannot focus blocks the submit entirely, and `.value` or `FormData` read before submit returns an empty string, which breaks htmx, Turbo, Livewire, autosave and unsaved-changes guards.
 
 **MarkdownEditor is different.** It sits transparently on top of your existing `<textarea>`:
 
 | Feature | MarkdownEditor | EasyMDE / SimpleMDE |
 |---|---|---|
-| Native `<textarea>` preserved | ✅ | ❌ Replaced |
-| Form submission works as-is | ✅ | ❌ Requires extra JS |
-| Get/set value via `.value` | ✅ | ❌ Custom API needed |
+| Native `<textarea>` preserved | ✅ | ❌ Hidden, edited as a copy |
+| Works with `required` fields | ✅ | ❌ Browser blocks the submit |
+| `.value` correct before submit | ✅ | ❌ Empty until the form submits |
+| Serialises with `FormData`, htmx, Turbo | ✅ | ❌ Needs the editor's own API |
 | WYSIWYG hybrid mode | ✅ | ❌ |
-| CSP-compatible (no inline JS) | ✅ | ❌ |
-| Zero CSS conflicts | ✅ | ❌ |
-| RTL support | ✅ | ❌ |
+| Inline event handlers (CSP) | ✅ None | Some |
+| RTL support | ✅ Built in | Via CodeMirror's `direction` option |
 | Built-in Find & Replace | ✅ | ❌ |
 | Swap the markdown parser | ✅ | ❌ |
 | Keyboard shortcuts | ✅ | Partial |
 | Dark mode / theming | ✅ | Limited |
+| Bundle size, gzipped | 51 KB | 107 KB (JS + CSS) |
 
 ## 🚀 Quick Start
 
@@ -149,7 +156,7 @@ useEffect(() => {
 }, []);
 ```
 
-Use `defaultValue`, not `value`. The editor writes to the textarea directly, so a controlled binding (or Vue's `:value`) would overwrite what the user is typing. Full React and Vue examples are in the [documentation](https://frutjam.com/community/plugins/markdown-editor).
+Use `defaultValue`, not `value`. The editor writes to the textarea directly, so a controlled binding (or Vue's `:value`) would overwrite what the user is typing. Full React and Vue examples are in the [documentation](https://frutjam.com/plugins/markdown-editor).
 
 The same two rules cover Svelte, Angular and anything else: don't bind the value, and call `destroy()` on unmount. In Angular, `onChange` fires outside the zone, so wrap it in `zone.run()` for change detection to notice.