Hello!
' }\n ],\n fontName: 'Arial',\n fontSize: '12pt',\n});\n\n// Get/set content\nconst html = editor.getContent();\neditor.setContent('New content
');\n\n// Insert content at cursor\neditor.insertContent('Bold text');\n\n// Execute commands (TinyMCE compatible)\neditor.execCommand('bold');\neditor.execCommand('fontsize', false, '14pt');\n\n// Listen to events\neditor.on('change', (content) => {\n console.log('Content changed:', content);\n});\n\neditor.on('dirty', (isDirty) => {\n console.log('Editor dirty state:', isDirty);\n});\n\n// Clean up\neditor.destroy();\n```\n\n### Browser (UMD)\n\nFor static pages without a bundler, load the self-contained UMD bundle via a `\n\n```\n\n`unpkg` and `jsdelivr` both serve the package; pin a version for production\n(e.g. `https://unpkg.com/@mdaemon/html-editor@1.7.0`).\n\n### Custom Toolbar Buttons\n\n```ts\nconst editor = new HTMLEditor(container, {\n setup: (ed) => {\n ed.ui.registry.addButton('myButton', {\n tooltip: 'My Custom Button',\n text: 'Click Me',\n onAction: () => {\n ed.insertContent('Custom content!
');\n },\n });\n },\n});\n```\n\n## Configuration Options\n\n| Option | Type | Default | Description |\n|--------|------|---------|-------------|\n| `basicEditor` | boolean | false | Use simplified toolbar for notes/tasks |\n| `readonly` | boolean | false | Start the editor in read-only mode (see `setReadOnly`) |\n| `forced_root_block` | 'p' \\| 'div' | 'p' | Block element produced on Enter. `'div'` gives CKEditor `ENTER_DIV` parity |\n| `trailingNode` | boolean | false | Append an empty trailing paragraph when the document ends in a block node (table, image, code block) so the cursor can be placed after it |\n| `includeTemplates` | boolean | false | Show template dropdown |\n| `templates` | Template[] | [] | Array of templates |\n| `dropbox` | boolean | false | Enable Dropbox integration |\n| `images_upload_url` | string | - | URL for image uploads |\n| `images_upload_credentials` | boolean | true | Include credentials in CORS upload requests |\n| `images_upload_base_path` | string | '/' | Base path prefix for uploaded image URLs |\n| `images_upload_max_size` | number | 10485760 | Maximum upload file size in bytes (default 10 MB) |\n| `images_upload_headers` | Record\\Thank you for reaching out.
',\n },\n {\n id: 2,\n title: 'Meeting Notes',\n description: 'Template for meeting minutes',\n content: 'Date: [date]
`/code block all survive verbatim. Pasting with Ctrl+V goes through a separate clipboard parser and is unaffected either way.\n\n### Importing wrapped HTML\n\nTemplate bodies also tend to arrive swaddled in container ``s — mail clients and CMSes nest several around the real content. The editor's schema has one block node per line and a block cannot contain a block, so that nesting cannot survive the parse. On import, a `` or `` that contains only block-level children and no text of its own is dissolved and its children hoisted, rather than being left behind as an empty block:\n\n```html\n\n
\n\n\n\nHello\nWorld\nHello\nWorld\n```\n\nInherited style on a dissolved wrapper (`font-family`, `font-size`, `font-weight`, `font-style`, `color`, `line-height`, `text-align`, `text-indent`, `direction`) is carried down to the children it wrapped, unless a child already states that property. A body wrapped in a single `` therefore keeps its font on every line. Box properties (border, background, padding, margin) describe the wrapper itself and cannot be re-expressed on *n* children, so they are dropped.\n\nBlocks that own their nesting are never dissolved: a ``, `- ` or table cell holding blocks is a real node in the schema, and the signature container (`
`) is left intact. A genuinely empty `` is a blank line the author typed, not a wrapper, and is preserved.\n\n### Placeholder links\n\nAn `` — a link whose target the author has not filled in yet, or that an upstream sanitizer has blanked — is preserved as a link on import, matching TinyMCE and CKEditor. URI validation is otherwise unchanged: a `javascript:` or `data:` target is still rejected and its anchor unwrapped to plain text.\n\n## Toolbar Buttons\n\nAll built-in toolbar button names that can be used in the `toolbar` config string:\n\n| Button | Description |\n|--------|-------------|\n| `bold` | Toggle bold |\n| `italic` | Toggle italic |\n| `underline` | Toggle underline |\n| `strikethrough` | Toggle strikethrough |\n| `subscript` | Toggle subscript |\n| `superscript` | Toggle superscript |\n| `bullist` | Toggle bullet list |\n| `numlist` | Toggle numbered list |\n| `outdent` | Decrease indent (see [Lists & Indentation](#lists--indentation)) |\n| `indent` | Increase indent (see [Lists & Indentation](#lists--indentation)) |\n| `blockquote` | Toggle block quote |\n| `fontfamily` | Font family dropdown (button shows the family at the cursor) |\n| `fontsize` | Font size dropdown (button shows the size at the cursor) |\n| `lineheight` | Line height dropdown (1, 1.2, 1.4, 1.6, 2) |\n| `blocks` | Block format dropdown (Paragraph, Heading 1–6; alias `formatselect`) |\n| `styles` | Named styles dropdown (configurable via `style_formats`) |\n| `table` | Table dropdown (insert table + row/column/cell operations) |\n| `hr` | Insert horizontal rule |\n| `template` | Template dropdown (requires `includeTemplates: true`) |\n| `alignleft` | Align left |\n| `aligncenter` | Align center |\n| `alignright` | Align right |\n| `alignjustify` | Justify text |\n| `forecolor` | Text color picker (40 preset colors + custom hex input + Remove color) |\n| `backcolor` | Highlight color picker (26 preset colors + custom hex input + Remove color) |\n| `removeformat` | Clear all formatting |\n| `copy` | Copy selection |\n| `cut` | Cut selection |\n| `paste` | Paste from clipboard (async Clipboard API; prefers HTML, falls back to plain text). Follows the Markdown mode when it is on |\n| `pastemarkdown` | Toggle paste-as-Markdown mode. Not in the default toolbars — add it to your `toolbar` string |\n| `undo` | Undo last change |\n| `redo` | Redo last undo |\n| `image` | Insert image dialog (upload file or enter URL) |\n| `charmap` | Special character picker (currency, math, arrows, symbols, Greek, punctuation) |\n| `emoticons` | Emoji picker with search (smileys, gestures, hearts, objects, symbols, arrows) |\n| `code` | Open HTML source code editor dialog |\n| `link` | Open Insert/Edit Link dialog |\n| `unlink` | Remove the link at the cursor |\n| `anchor` | Insert a named anchor (`` target) |\n| `codesample` | Toggle code sample block |\n| `fullscreen` | Toggle fullscreen editing mode |\n| `preview` | Open content preview in a new window (the window carries a Content Security Policy that blocks script; images and inline styles still render) |\n| `searchreplace` | Open Find & Replace dialog |\n| `speechtotext` | Open Speech to Text dialog (browser support required) |\n| `dictate` | Toggle inline dictation — inserts speech directly at cursor (browser support required) |\n| `ltr` | Set text direction to left-to-right |\n| `rtl` | Set text direction to right-to-left |\n\n### Default toolbars\n\n**Full toolbar** (default when `basicEditor: false`):\n\n```text\nbold italic underline strikethrough subscript superscript | blocks styles | bullist numlist outdent indent blockquote | fontfamily fontsize | lineheight alignleft aligncenter alignright alignjustify | forecolor backcolor | removeformat copy cut paste | undo redo | image table charmap emoticons hr | fullscreen preview | code link unlink anchor codesample | ltr rtl | searchreplace\n```\n\n**Basic toolbar** (when `basicEditor: true`):\n\n```text\nbold italic underline strikethrough subscript superscript | bullist numlist outdent indent | fontfamily fontsize blockquote | lineheight alignleft aligncenter alignright alignjustify | forecolor backcolor | removeformat copy cut paste | undo redo | charmap emoticons | link unlink | ltr rtl | searchreplace\n```\n\n## Image Upload\n\nThe image button opens a two-tab dialog:\n\n- **Upload** — Drag-and-drop or browse for a local file. Supports JPEG, PNG, GIF, WebP, and SVG.\n- **URL** — Enter an image URL directly.\n\nIf `images_upload_url` is configured, files are sent as `multipart/form-data` to that endpoint. The server response must be JSON containing a `location`, `url`, or `link` field with the resulting image URL. When no upload URL is set, images are embedded as base64 data URIs.\n\nSVG files are automatically sanitized — dangerous elements (`