|
9 | 9 |
|
10 | 10 | --- |
11 | 11 |
|
| 12 | +## 🆕 What's New in v1.2.0 |
| 13 | + |
| 14 | +- **Character-Level Collaboration** - Multiple users can now type in the same paragraph simultaneously without conflicts |
| 15 | +- **Webtools Links Integration** - Optional integration with PluginPal's Webtools Links addon for internal/external link management |
| 16 | +- **Improved Fullscreen Mode** - Blocks now stretch to full width, Media Library modal works correctly |
| 17 | +- **Performance Improvements** - Removed debug logging, optimized Y.js sync |
| 18 | + |
| 19 | +--- |
| 20 | + |
12 | 21 | ## Introduction |
13 | 22 |
|
14 | 23 | Magic Editor X is a production-ready Strapi v5 Custom Field that brings the power of Editor.js to your content management workflow. Unlike traditional WYSIWYG replacements or plugins that override Strapi's default editor, Magic Editor X integrates as a **proper Custom Field** in Strapi's Content-Type Builder, giving you complete control over when and where to use it. |
@@ -59,13 +68,16 @@ admin/ |
59 | 68 | ├── src/ |
60 | 69 | │ ├── components/ |
61 | 70 | │ │ ├── EditorJS/ # Main editor component |
62 | | -│ │ ├── EditorTools/ # Custom tools (Button, Hyperlink, AI) |
| 71 | +│ │ ├── EditorTools/ # Custom tools (Button, Hyperlink, AI, WebtoolsLink) |
63 | 72 | │ │ ├── MediaLib/ # Strapi Media Library adapter |
64 | 73 | │ │ └── LiveCollaborationPanel.jsx # Collaboration UI |
65 | 74 | │ ├── hooks/ |
66 | 75 | │ │ ├── useMagicCollaboration.js # Y.js & Socket.io integration |
| 76 | +│ │ ├── useWebtoolsLinks.js # 🆕 Webtools Links addon integration |
67 | 77 | │ │ ├── useAIAssistant.js # AI features |
68 | 78 | │ │ └── useLicense.js # License management |
| 79 | +│ ├── utils/ |
| 80 | +│ │ └── YTextBinding.js # 🆕 Y.Text <-> contenteditable binding |
69 | 81 | │ ├── config/ |
70 | 82 | │ │ └── tools.js # Editor.js tools configuration |
71 | 83 | │ └── index.js # Plugin registration |
@@ -187,6 +199,26 @@ Magic Editor X uses Y.js, a battle-tested CRDT implementation, to enable true re |
187 | 199 | 5. **Automatic Merge** - Y.js guarantees conflict-free merges (no "last write wins") |
188 | 200 | 6. **Persistence** - Changes are stored in IndexedDB for offline capability |
189 | 201 |
|
| 202 | +**🆕 Character-Level Collaboration (v1.2.0)** |
| 203 | + |
| 204 | +Starting with v1.2.0, Magic Editor X supports **simultaneous editing within the same block**. Multiple users can type in the same paragraph at the same time without conflicts: |
| 205 | + |
| 206 | +``` |
| 207 | +┌─────────────────────────────────────────────────────────┐ |
| 208 | +│ Before v1.2.0: Block-Level Sync │ |
| 209 | +│ User A edits Block 1 → User B's Block 1 changes lost │ |
| 210 | +├─────────────────────────────────────────────────────────┤ |
| 211 | +│ After v1.2.0: Character-Level Sync │ |
| 212 | +│ User A types "Hello" → User B types "World" → "HelloWorld" │ |
| 213 | +│ Both changes merge seamlessly! │ |
| 214 | +└─────────────────────────────────────────────────────────┘ |
| 215 | +``` |
| 216 | + |
| 217 | +**Hybrid Data Structure:** |
| 218 | +- `Y.Map` for block metadata (type, tunes, order) |
| 219 | +- `Y.Text` for character-level content (rich text with formatting) |
| 220 | +- `Y.Map` for document metadata (blockOrder, timestamps) |
| 221 | + |
190 | 222 | **Example: Collaborative Editing Flow** |
191 | 223 |
|
192 | 224 | ```javascript |
@@ -315,7 +347,44 @@ class MediaLibAdapter { |
315 | 347 | } |
316 | 348 | ``` |
317 | 349 |
|
318 | | -### 5. AI-Powered Features (Premium) |
| 350 | +### 5. Webtools Links Integration (Optional) |
| 351 | + |
| 352 | +Magic Editor X integrates seamlessly with the [Webtools Links addon](https://www.pluginpal.io/plugin/webtools) by PluginPal for enhanced link management: |
| 353 | + |
| 354 | +**Features:** |
| 355 | +- 🔗 **Internal Link Picker** - Select pages/entries from your Strapi content |
| 356 | +- 🌐 **External URL Support** - Paste external URLs with validation |
| 357 | +- ✏️ **Edit Existing Links** - Click on a link to edit its URL and text |
| 358 | +- 🔍 **Link Detection** - Automatically detects when cursor is inside a link |
| 359 | + |
| 360 | +**Setup:** |
| 361 | + |
| 362 | +1. Install the Webtools Links addon (requires Webtools license) |
| 363 | +2. Magic Editor X auto-detects the addon and enables the Link Picker button |
| 364 | + |
| 365 | +**Usage:** |
| 366 | + |
| 367 | +```javascript |
| 368 | +// The integration uses Strapi's plugin API |
| 369 | +const getPlugin = useStrapiApp('WebtoolsLinks', (state) => state.getPlugin); |
| 370 | +const linksPlugin = getPlugin('webtools-addon-links'); |
| 371 | +const { openLinkPicker } = linksPlugin?.apis; |
| 372 | + |
| 373 | +// Open picker with existing link data (for editing) |
| 374 | +const result = await openLinkPicker({ |
| 375 | + linkType: 'both', // 'internal', 'external', or 'both' |
| 376 | + initialHref: existingUrl, // Pre-fill for editing |
| 377 | + initialText: selectedText // Pre-fill link text |
| 378 | +}); |
| 379 | +``` |
| 380 | +
|
| 381 | +**Without Webtools:** |
| 382 | +
|
| 383 | +If Webtools is not installed, a subtle promo link appears in the editor footer pointing to the addon store page. |
| 384 | +
|
| 385 | +--- |
| 386 | +
|
| 387 | +### 6. AI-Powered Features (Premium) |
319 | 388 |
|
320 | 389 | Built-in AI assistant for content enhancement: |
321 | 390 |
|
@@ -907,13 +976,21 @@ Add to `config/plugins.ts`: |
907 | 976 |
|
908 | 977 | ## Roadmap |
909 | 978 |
|
910 | | -- **Version History** - Track all content changes with restore capability |
| 979 | +### ✅ Completed |
| 980 | +- **Version History** - Track all content changes with snapshot restore (v1.1.0) |
| 981 | +- **Character-Level Collaboration** - Simultaneous editing in same block (v1.2.0) |
| 982 | +- **Webtools Links Integration** - Internal/external link picker (v1.2.0) |
| 983 | + |
| 984 | +### 🚧 In Progress |
| 985 | +- **Comments & Annotations** - Inline comments for editorial workflow |
911 | 986 | - **Custom Blocks API** - Simplified API for creating custom tools |
| 987 | + |
| 988 | +### 📋 Planned |
912 | 989 | - **Advanced AI** - Content suggestions, auto-completion, tone analysis |
913 | | -- **Comments & Annotations** - Inline comments for editorial workflow |
914 | 990 | - **Offline Mode** - Full offline editing with sync on reconnect |
915 | 991 | - **Import/Export** - Markdown, HTML, DOCX conversion |
916 | 992 | - **Templates** - Pre-built content templates |
| 993 | +- **Block Permissions** - Per-block editing restrictions |
917 | 994 |
|
918 | 995 | --- |
919 | 996 |
|
|
0 commit comments