From d196f58cae492f7c517a7a7a4c890c8522ce6638 Mon Sep 17 00:00:00 2001 From: Karl Kemister-Sheppard Date: Wed, 7 Oct 2026 10:58:19 +1000 Subject: [PATCH 1/6] TINYDOC-3639: New multi-editor support for TinyMCE AI. --- .../tinymceai-multi-editor-groups/example.js | 93 ++++++++++ .../tinymceai-multi-editor-groups/index.html | 72 ++++++++ .../tinymceai-multi-editor-groups/index.js | 165 ++++++++++++++++++ .../tinymceai-multi-editor/example.js | 75 ++++++++ .../tinymceai-multi-editor/index.html | 62 +++++++ .../tinymceai-multi-editor/index.js | 145 +++++++++++++++ .../tinymceai/tinymceai-context-tag.png | Bin 0 -> 2651 bytes modules/ROOT/nav.adoc | 1 + modules/ROOT/pages/8.10.0-release-notes.adoc | 19 ++ modules/ROOT/pages/tinymceai-actions.adoc | 1 + modules/ROOT/pages/tinymceai-chat.adoc | 1 + .../ROOT/pages/tinymceai-multi-editor.adoc | 139 +++++++++++++++ modules/ROOT/pages/tinymceai-review.adoc | 1 + .../configuration/tinymceai_options.adoc | 132 ++++++++++++++ .../partials/misc/admon-requires-8.10v.adoc | 1 + 15 files changed, 907 insertions(+) create mode 100644 modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/example.js create mode 100644 modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.html create mode 100644 modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.js create mode 100644 modules/ROOT/examples/live-demos/tinymceai-multi-editor/example.js create mode 100644 modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.html create mode 100644 modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.js create mode 100644 modules/ROOT/images/tinymceai/tinymceai-context-tag.png create mode 100644 modules/ROOT/pages/tinymceai-multi-editor.adoc create mode 100644 modules/ROOT/partials/misc/admon-requires-8.10v.adoc diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/example.js b/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/example.js new file mode 100644 index 0000000000..e2dcbc7e4f --- /dev/null +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/example.js @@ -0,0 +1,93 @@ +// Step 1: Set up session - this should be part of the application's user management process. +// Open-source plugins below are only for editing the demo HTML (lists, links, tables). TinyMCE AI options are the focus. +// Share one TinyMCE AI configuration between every editor. Each editor sets its own group, so the page holds two independent groups. +const sharedSettings = { + height: '600px', + plugins: ['tinymceai', 'advlist', 'lists', 'link', 'autolink', 'table', 'wordcount'], + toolbar: 'undo redo | tinymceai-chat ai-quickactions-translate tinymceai-review | styles | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link', + tinymceai_sidebar_type: 'floating', + tinymceai_chat_welcome_message: '

Welcome to TinyMCE AI. Pick an action below or type your own prompt.

', + tinymceai_chat_welcome_actions: [ + { text: 'Here are some actions to get started:' }, + { title: 'Summarize the document', command: 'TinyMCEAIQuickActionsSummarize' }, + { title: 'Continue writing', command: 'TinyMCEAIQuickActionContinueWriting' }, + { title: 'Translate to Spanish', command: 'TinyMCEAIQuickActionTranslate', value: 'spanish' }, + { title: 'Review my document', command: 'ToggleSidebar', value: 'tinymceai-review' } + ], + tinymceai_token_provider: async () => { + return fetch('/api/tinymceai-token', { credentials: 'include' }) + .then(resp => resp.text()) + .then(token => ({ token })); + }, + tinymceai_chat_fetch_sources: () => Promise.resolve([{ + label: 'TinyMCE resources', + sources: [ + { id: 'docs', label: 'TinyMCE Documentation', type: 'web-resource' }, + { id: 'blog', label: 'Tiny Blog', type: 'web-resource' }, + { id: 'survey-2023', label: 'State of rich text editing 2023', type: 'web-resource' }, + ] + }]), + tinymceai_chat_fetch_source: (id) => { + const urls = { + 'docs': 'https://www.tiny.cloud/docs/tinymce/latest/', + 'blog': 'https://www.tiny.cloud/blog/', + 'survey-2023': 'https://www.tiny.cloud/developer-survey-results-2023/', + }; + return Promise.resolve({ type: 'web-resource', url: urls[id] }); + }, + tinymceai_quickactions_custom: [ + { + type: 'chat', + title: 'Challenge', + prompt: 'Challenge statements, verify facts and identify assumptions' + } + ], + tinymceai_languages: [ + { title: 'English', language: 'english' }, + { title: 'Chinese (Simplified)', language: 'chinese' }, + { title: 'Spanish', language: 'spanish' }, + { title: 'German', language: 'german' }, + { title: 'Japanese', language: 'japanese' }, + { title: 'Portuguese', language: 'portuguese' }, + { title: 'Swedish', language: 'swedish' }, + { title: 'Korean', language: 'korean' }, + { title: 'Hindi (Devanagari)', language: 'hindi devanagari' }, + { title: 'Italian', language: 'italian' }, + { title: 'Klingon', language: 'klingon' }, + { title: 'Dothraki', language: 'dothraki' }, + ] +}; + +// Group 1: the Introduction and Native integration editors share one AI sidebar. +tinymce.init({ + ...sharedSettings, + selector: 'textarea#tinymceai-multi-editor-groups-introduction', + tinymceai_group: 'article-opening', + tinymceai_document_name: 'Introduction', + tinymceai_document_description: 'The introduction of the article. A title, a short paragraph that sets out the topic, and a figure.' +}); + +tinymce.init({ + ...sharedSettings, + selector: 'textarea#tinymceai-multi-editor-groups-native-integration', + tinymceai_group: 'article-opening', + tinymceai_document_name: 'Native integration', + tinymceai_document_description: 'The section on moving from external AI tools to AI built into the editor, with a bulleted list of benefits.' +}); + +// Group 2: the Workflow comparison and Adoption challenges editors share a separate AI sidebar and never see the content of group 1. +tinymce.init({ + ...sharedSettings, + selector: 'textarea#tinymceai-multi-editor-groups-workflow-comparison', + tinymceai_group: 'article-analysis', + tinymceai_document_name: 'Workflow comparison', + tinymceai_document_description: 'The section that compares traditional and AI-enhanced workflows. Keep the comparison table.' +}); + +tinymce.init({ + ...sharedSettings, + selector: 'textarea#tinymceai-multi-editor-groups-adoption-challenges', + tinymceai_group: 'article-analysis', + tinymceai_document_name: 'Adoption challenges', + tinymceai_document_description: 'The closing section on adoption challenges. Two short paragraphs.' +}); diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.html b/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.html new file mode 100644 index 0000000000..9b05f4f4b3 --- /dev/null +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.html @@ -0,0 +1,72 @@ +

Group "article-opening", editor 1: Introduction (hosts the AI sidebar of the group)

+ + +

Group "article-opening", editor 2: Native integration (shares the AI sidebar of the Introduction editor)

+ + +
+ +

Group "article-analysis", editor 3: Workflow comparison (hosts the AI sidebar of the group)

+ + +

Group "article-analysis", editor 4: Adoption challenges (shares the AI sidebar of the Workflow comparison editor)

+ diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.js b/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.js new file mode 100644 index 0000000000..31c237dde3 --- /dev/null +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.js @@ -0,0 +1,165 @@ +// Step 1: Set up session - this should be part of the application's user management process. We simulate that here by creating a session for a random user. +const apiKey = '{{tinymceai_demo_api_key}}'; +const isLoggedIn = fetch(`https://demo.api.tiny.cloud/1/${apiKey}/auth/random`, { method: "POST", credentials: "include" }); + +const mentions_fetch = async (query, success) => { + const searchPhrase = query.term.toLowerCase(); + await fetch(`https://demouserdirectory.tiny.cloud/v1/users?q=${encodeURIComponent(searchPhrase)}`) + .then((response) => response.json()) + .then((users) => success(users.data.map((userInfo) => ({ + id: userInfo.id, + name: userInfo.name, + image: userInfo.avatar, + description: userInfo.custom.role + })))) + .catch(() => {}); +}; + +const fetch_users = (userIds) => Promise.all(userIds.map((userId) => fetch(`https://demouserdirectory.tiny.cloud/v1/users/${userId}`).then((response) => response.json()).catch(() => ({ id: userId })))); + +// Each editor seeds its revision history from its own textarea. +const createRevisionHistoryFetch = (selector) => () => { + const textarea = document.querySelector(selector); + const initialContent = textarea ? textarea.value : ''; + const revisions = [ + { + revisionId: '1', + createdAt: new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate() - 1, 14, 32, 0).getTime(), + author: { + id: 'jade-scott', + name: 'Jade Scott', + avatar: 'https://sneak-preview.tiny.cloud/demouserdirectory/images/employee_jade-scott_128_515dc6a1.jpg', + }, + content: initialContent + }, + { + revisionId: '0', + createdAt: new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate() - 1, 14, 32, 0).getTime(), + author: { + id: 'jade-scott', + name: 'Jade Scott', + avatar: 'https://sneak-preview.tiny.cloud/demouserdirectory/images/employee_jade-scott_128_515dc6a1.jpg', + }, + content: '' + } + ]; + return Promise.resolve(revisions.sort((a, b) => (new Date(a.createdAt) < new Date(b.createdAt) ? -1 : 1))); +}; + +// Share one TinyMCE AI configuration between every editor. Each editor sets its own group, so the page holds two independent groups. +const sharedSettings = { + height: '600px', + plugins: [ + 'autolink', 'link', 'emoticons', 'lists', 'table', 'advlist', 'searchreplace', 'wordcount', 'autocorrect', 'tinymcespellchecker', 'charmap', 'fullscreen', 'advcode', 'accordion', 'anchor', 'footnotes', 'powerpaste', 'importword', 'exportpdf', 'exportword', 'markdown', 'a11ychecker', 'typography', 'casechange', 'checklist', 'advtable', 'formatpainter', 'permanentpen', 'tableofcontents', 'help', 'math', 'linkchecker', 'media', 'mediaembed', + 'quickbars', 'tinymceai', 'tinycomments', 'mentions', 'revisionhistory', 'suggestededits', 'uploadcare' + ], + toolbar: 'undo redo | tinymceai-chat tinymceai-review ai-quickactions-translate spellchecker | styles | bold italic underline forecolor backcolor casechange | link uploadcare table addcomment | align bullist numlist checklist removeformat | code fullscreen help', + tinymceai_sidebar_type: 'floating', + quickbars_selection_toolbar: 'tinymceai-quickactions addcomment', + tinymceai_chat_welcome_message: '

Welcome to TinyMCE AI. Pick an action below or type your own prompt.

', + tinymceai_chat_welcome_actions: [ + { text: 'Here are some actions to get started:' }, + { title: 'Summarize the document', command: 'TinyMCEAIQuickActionsSummarize' }, + { title: 'Continue writing', command: 'TinyMCEAIQuickActionContinueWriting' }, + { title: 'Translate to Spanish', command: 'TinyMCEAIQuickActionTranslate', value: 'spanish' }, + { title: 'Review my document', command: 'ToggleSidebar', value: 'tinymceai-review' } + ], + toolbar_mode: 'sliding', + visual: false, + images_file_types: 'jpeg,jpg,jpe,jfi,jif,jfif,png,gif,bmp,webp,svg', + user_id: 'james-wilson', + spellchecker_active: true, + spellchecker_dialog: true, + uploadcare_public_key: '630992ad50fe2291c406', + uploadcare_store_type: 'temporary', + advcode_inline: true, + tinycomments_mode: 'embedded', + suggestededits_content: 'html', + mentions_item_type: 'profile', + mentions_fetch, + fetch_users, + revisionhistory_display_author: true, + tinymceai_token_provider: async () => { + // Step 2: Check we have a session then fetch JWT + return isLoggedIn.then(() => + fetch(`https://demo.api.tiny.cloud/1/${apiKey}/jwt/tinymceai`, { credentials: "include" }) + .then(resp => resp.text()) + .then(token => ({ token })) + ); + }, + tinymceai_chat_fetch_sources: () => Promise.resolve([{ + label: 'TinyMCE resources', + sources: [ + { id: 'docs', label: 'TinyMCE Documentation', type: 'web-resource' }, + { id: 'blog', label: 'Tiny Blog', type: 'web-resource' }, + { id: 'survey-2023', label: 'State of rich text editing 2023', type: 'web-resource' }, + ] + }]), + tinymceai_chat_fetch_source: (id) => { + const urls = { + 'docs': 'https://www.tiny.cloud/docs/tinymce/latest/', + 'blog': 'https://www.tiny.cloud/blog/', + 'survey-2023': 'https://www.tiny.cloud/developer-survey-results-2023/', + }; + return Promise.resolve({ type: 'web-resource', url: urls[id] }); + }, + tinymceai_quickactions_custom: [ + { + type: 'chat', + title: 'Challenge', + prompt: 'Challenge statements, verify facts and identify assumptions' + } + ], + tinymceai_languages: [ + { title: 'English', language: 'english' }, + { title: 'Chinese (Simplified)', language: 'chinese' }, + { title: 'Spanish', language: 'spanish' }, + { title: 'German', language: 'german' }, + { title: 'Japanese', language: 'japanese' }, + { title: 'Portuguese', language: 'portuguese' }, + { title: 'Swedish', language: 'swedish' }, + { title: 'Korean', language: 'korean' }, + { title: 'Hindi (Devanagari)', language: 'hindi devanagari' }, + { title: 'Italian', language: 'italian' }, + { title: 'Klingon', language: 'klingon' }, + { title: 'Dothraki', language: 'dothraki' }, + ] +}; + +// Group 1: the Introduction and Native integration editors share one AI sidebar. +tinymce.init({ + ...sharedSettings, + selector: 'textarea#tinymceai-multi-editor-groups-introduction', + revisionhistory_fetch: createRevisionHistoryFetch('textarea#tinymceai-multi-editor-groups-introduction'), + tinymceai_group: 'article-opening', + tinymceai_document_name: 'Introduction', + tinymceai_document_description: 'The introduction of the article. A title, a short paragraph that sets out the topic, and a figure.' +}); + +tinymce.init({ + ...sharedSettings, + selector: 'textarea#tinymceai-multi-editor-groups-native-integration', + revisionhistory_fetch: createRevisionHistoryFetch('textarea#tinymceai-multi-editor-groups-native-integration'), + tinymceai_group: 'article-opening', + tinymceai_document_name: 'Native integration', + tinymceai_document_description: 'The section on moving from external AI tools to AI built into the editor, with a bulleted list of benefits.' +}); + +// Group 2: the Workflow comparison and Adoption challenges editors share a separate AI sidebar and never see the content of group 1. +tinymce.init({ + ...sharedSettings, + selector: 'textarea#tinymceai-multi-editor-groups-workflow-comparison', + revisionhistory_fetch: createRevisionHistoryFetch('textarea#tinymceai-multi-editor-groups-workflow-comparison'), + tinymceai_group: 'article-analysis', + tinymceai_document_name: 'Workflow comparison', + tinymceai_document_description: 'The section that compares traditional and AI-enhanced workflows. Keep the comparison table.' +}); + +tinymce.init({ + ...sharedSettings, + selector: 'textarea#tinymceai-multi-editor-groups-adoption-challenges', + revisionhistory_fetch: createRevisionHistoryFetch('textarea#tinymceai-multi-editor-groups-adoption-challenges'), + tinymceai_group: 'article-analysis', + tinymceai_document_name: 'Adoption challenges', + tinymceai_document_description: 'The closing section on adoption challenges. Two short paragraphs.' +}); diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/example.js b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/example.js new file mode 100644 index 0000000000..6aadfe8360 --- /dev/null +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/example.js @@ -0,0 +1,75 @@ +// Step 1: Set up session - this should be part of the application's user management process. +// Open-source plugins below are only for editing the demo HTML (lists, links, tables). TinyMCE AI options are the focus. +// Share one TinyMCE AI configuration between every editor in the group. +const sharedSettings = { + height: '800px', + plugins: ['tinymceai', 'advlist', 'lists', 'link', 'autolink', 'table', 'wordcount'], + toolbar: 'undo redo | tinymceai-chat ai-quickactions-translate tinymceai-review | styles | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link', + tinymceai_sidebar_type: 'floating', + tinymceai_chat_welcome_message: '

Welcome to TinyMCE AI. Pick an action below or type your own prompt.

', + tinymceai_chat_welcome_actions: [ + { text: 'Here are some actions to get started:' }, + { title: 'Summarize the document', command: 'TinyMCEAIQuickActionsSummarize' }, + { title: 'Continue writing', command: 'TinyMCEAIQuickActionContinueWriting' }, + { title: 'Translate to Spanish', command: 'TinyMCEAIQuickActionTranslate', value: 'spanish' }, + { title: 'Review my document', command: 'ToggleSidebar', value: 'tinymceai-review' } + ], + tinymceai_token_provider: async () => { + return fetch('/api/tinymceai-token', { credentials: 'include' }) + .then(resp => resp.text()) + .then(token => ({ token })); + }, + tinymceai_chat_fetch_sources: () => Promise.resolve([{ + label: 'TinyMCE resources', + sources: [ + { id: 'docs', label: 'TinyMCE Documentation', type: 'web-resource' }, + { id: 'blog', label: 'Tiny Blog', type: 'web-resource' }, + { id: 'survey-2023', label: 'State of rich text editing 2023', type: 'web-resource' }, + ] + }]), + tinymceai_chat_fetch_source: (id) => { + const urls = { + 'docs': 'https://www.tiny.cloud/docs/tinymce/latest/', + 'blog': 'https://www.tiny.cloud/blog/', + 'survey-2023': 'https://www.tiny.cloud/developer-survey-results-2023/', + }; + return Promise.resolve({ type: 'web-resource', url: urls[id] }); + }, + tinymceai_quickactions_custom: [ + { + type: 'chat', + title: 'Challenge', + prompt: 'Challenge statements, verify facts and identify assumptions' + } + ], + tinymceai_languages: [ + { title: 'English', language: 'english' }, + { title: 'Chinese (Simplified)', language: 'chinese' }, + { title: 'Spanish', language: 'spanish' }, + { title: 'German', language: 'german' }, + { title: 'Japanese', language: 'japanese' }, + { title: 'Portuguese', language: 'portuguese' }, + { title: 'Swedish', language: 'swedish' }, + { title: 'Korean', language: 'korean' }, + { title: 'Hindi (Devanagari)', language: 'hindi devanagari' }, + { title: 'Italian', language: 'italian' }, + { title: 'Klingon', language: 'klingon' }, + { title: 'Dothraki', language: 'dothraki' }, + ] +}; + +tinymce.init({ + ...sharedSettings, + selector: 'textarea#tinymceai-multi-editor-introduction', + tinymceai_group: 'article', + tinymceai_document_name: 'Introduction', + tinymceai_document_description: 'The introduction of the article. A title, a short paragraph that sets out the topic, and a figure.' +}); + +tinymce.init({ + ...sharedSettings, + selector: 'textarea#tinymceai-multi-editor-body', + tinymceai_group: 'article', + tinymceai_document_name: 'Body', + tinymceai_document_description: 'The main body of the article. Uses h2 and h3 subheadings, short paragraphs, a bulleted list, and a comparison table.' +}); diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.html b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.html new file mode 100644 index 0000000000..99bdd97b18 --- /dev/null +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.html @@ -0,0 +1,62 @@ +

Editor 1: Introduction (hosts the shared AI sidebar)

+ + +

Editor 2: Body (shares the AI sidebar of editor 1)

+ diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.js b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.js new file mode 100644 index 0000000000..a601d843ed --- /dev/null +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.js @@ -0,0 +1,145 @@ +// Step 1: Set up session - this should be part of the application's user management process. We simulate that here by creating a session for a random user. +const apiKey = '{{tinymceai_demo_api_key}}'; +const isLoggedIn = fetch(`https://demo.api.tiny.cloud/1/${apiKey}/auth/random`, { method: "POST", credentials: "include" }); + +const mentions_fetch = async (query, success) => { + const searchPhrase = query.term.toLowerCase(); + await fetch(`https://demouserdirectory.tiny.cloud/v1/users?q=${encodeURIComponent(searchPhrase)}`) + .then((response) => response.json()) + .then((users) => success(users.data.map((userInfo) => ({ + id: userInfo.id, + name: userInfo.name, + image: userInfo.avatar, + description: userInfo.custom.role + })))) + .catch(() => {}); +}; + +const fetch_users = (userIds) => Promise.all(userIds.map((userId) => fetch(`https://demouserdirectory.tiny.cloud/v1/users/${userId}`).then((response) => response.json()).catch(() => ({ id: userId })))); + +// Each editor seeds its revision history from its own textarea. +const createRevisionHistoryFetch = (selector) => () => { + const textarea = document.querySelector(selector); + const initialContent = textarea ? textarea.value : ''; + const revisions = [ + { + revisionId: '1', + createdAt: new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate() - 1, 14, 32, 0).getTime(), + author: { + id: 'jade-scott', + name: 'Jade Scott', + avatar: 'https://sneak-preview.tiny.cloud/demouserdirectory/images/employee_jade-scott_128_515dc6a1.jpg', + }, + content: initialContent + }, + { + revisionId: '0', + createdAt: new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate() - 1, 14, 32, 0).getTime(), + author: { + id: 'jade-scott', + name: 'Jade Scott', + avatar: 'https://sneak-preview.tiny.cloud/demouserdirectory/images/employee_jade-scott_128_515dc6a1.jpg', + }, + content: '' + } + ]; + return Promise.resolve(revisions.sort((a, b) => (new Date(a.createdAt) < new Date(b.createdAt) ? -1 : 1))); +}; + +// Share one TinyMCE AI configuration between every editor in the group. +const sharedSettings = { + height: '800px', + plugins: [ + 'autolink', 'link', 'emoticons', 'lists', 'table', 'advlist', 'searchreplace', 'wordcount', 'autocorrect', 'tinymcespellchecker', 'charmap', 'fullscreen', 'advcode', 'accordion', 'anchor', 'footnotes', 'powerpaste', 'importword', 'exportpdf', 'exportword', 'markdown', 'a11ychecker', 'typography', 'casechange', 'checklist', 'advtable', 'formatpainter', 'permanentpen', 'tableofcontents', 'help', 'math', 'linkchecker', 'media', 'mediaembed', + 'quickbars', 'tinymceai', 'tinycomments', 'mentions', 'revisionhistory', 'suggestededits', 'uploadcare' + ], + toolbar: 'undo redo | tinymceai-chat tinymceai-review ai-quickactions-translate spellchecker | styles | bold italic underline forecolor backcolor casechange | link uploadcare table addcomment | align bullist numlist checklist removeformat | code fullscreen help', + tinymceai_sidebar_type: 'floating', + quickbars_selection_toolbar: 'tinymceai-quickactions addcomment', + tinymceai_chat_welcome_message: '

Welcome to TinyMCE AI. Pick an action below or type your own prompt.

', + tinymceai_chat_welcome_actions: [ + { text: 'Here are some actions to get started:' }, + { title: 'Summarize the document', command: 'TinyMCEAIQuickActionsSummarize' }, + { title: 'Continue writing', command: 'TinyMCEAIQuickActionContinueWriting' }, + { title: 'Translate to Spanish', command: 'TinyMCEAIQuickActionTranslate', value: 'spanish' }, + { title: 'Review my document', command: 'ToggleSidebar', value: 'tinymceai-review' } + ], + toolbar_mode: 'sliding', + visual: false, + images_file_types: 'jpeg,jpg,jpe,jfi,jif,jfif,png,gif,bmp,webp,svg', + user_id: 'james-wilson', + spellchecker_active: true, + spellchecker_dialog: true, + uploadcare_public_key: '630992ad50fe2291c406', + uploadcare_store_type: 'temporary', + advcode_inline: true, + tinycomments_mode: 'embedded', + suggestededits_content: 'html', + mentions_item_type: 'profile', + mentions_fetch, + fetch_users, + revisionhistory_display_author: true, + tinymceai_token_provider: async () => { + // Step 2: Check we have a session then fetch JWT + return isLoggedIn.then(() => + fetch(`https://demo.api.tiny.cloud/1/${apiKey}/jwt/tinymceai`, { credentials: "include" }) + .then(resp => resp.text()) + .then(token => ({ token })) + ); + }, + tinymceai_chat_fetch_sources: () => Promise.resolve([{ + label: 'TinyMCE resources', + sources: [ + { id: 'docs', label: 'TinyMCE Documentation', type: 'web-resource' }, + { id: 'blog', label: 'Tiny Blog', type: 'web-resource' }, + { id: 'survey-2023', label: 'State of rich text editing 2023', type: 'web-resource' }, + ] + }]), + tinymceai_chat_fetch_source: (id) => { + const urls = { + 'docs': 'https://www.tiny.cloud/docs/tinymce/latest/', + 'blog': 'https://www.tiny.cloud/blog/', + 'survey-2023': 'https://www.tiny.cloud/developer-survey-results-2023/', + }; + return Promise.resolve({ type: 'web-resource', url: urls[id] }); + }, + tinymceai_quickactions_custom: [ + { + type: 'chat', + title: 'Challenge', + prompt: 'Challenge statements, verify facts and identify assumptions' + } + ], + tinymceai_languages: [ + { title: 'English', language: 'english' }, + { title: 'Chinese (Simplified)', language: 'chinese' }, + { title: 'Spanish', language: 'spanish' }, + { title: 'German', language: 'german' }, + { title: 'Japanese', language: 'japanese' }, + { title: 'Portuguese', language: 'portuguese' }, + { title: 'Swedish', language: 'swedish' }, + { title: 'Korean', language: 'korean' }, + { title: 'Hindi (Devanagari)', language: 'hindi devanagari' }, + { title: 'Italian', language: 'italian' }, + { title: 'Klingon', language: 'klingon' }, + { title: 'Dothraki', language: 'dothraki' }, + ] +}; + +tinymce.init({ + ...sharedSettings, + selector: 'textarea#tinymceai-multi-editor-introduction', + revisionhistory_fetch: createRevisionHistoryFetch('textarea#tinymceai-multi-editor-introduction'), + tinymceai_group: 'article', + tinymceai_document_name: 'Introduction', + tinymceai_document_description: 'The introduction of the article. A title, a short paragraph that sets out the topic, and a figure.' +}); + +tinymce.init({ + ...sharedSettings, + selector: 'textarea#tinymceai-multi-editor-body', + revisionhistory_fetch: createRevisionHistoryFetch('textarea#tinymceai-multi-editor-body'), + tinymceai_group: 'article', + tinymceai_document_name: 'Body', + tinymceai_document_description: 'The main body of the article. Uses h2 and h3 subheadings, short paragraphs, a bulleted list, and a comparison table.' +}); diff --git a/modules/ROOT/images/tinymceai/tinymceai-context-tag.png b/modules/ROOT/images/tinymceai/tinymceai-context-tag.png new file mode 100644 index 0000000000000000000000000000000000000000..b04ead3a52184cf922743408ea41a963a83e9110 GIT binary patch literal 2651 zcmV-h3Z(UkP)smvONu!=>Dy@1n8ke9LQKC{cF-GZU@7?>mzxzf&o#mHFFF}x23Id)J01aBKNoJRj3dz2+ zjaIgUeHPfS+%jn;{dq?~i#3^%NjBK+?uqpweiCo0}V2>@m|g2bh6NBfL}s zzCL#qdHMNJxV!VpDA}n(65=rtZFGCUiQnGf#nBE133wRQ-?|4+Gg3a}uG z(0Ky!+moshn<5ea7bWQUNpOzXM+%U#wm+3xySq&3qDj z2v$*XG4wh$&8a}S(E%dQ5QRuD;Oey;v~I0~hr5T%XAlR&X}C!IB|)WBLaWiDZ`U>$ z(618)Jl75Vy0u0BetjHZw`q&BUw(zqNz+hNUIQ=B`V)f^0D|3$xK*pLecQ*lbMG$B zetQnFbLJu_cpUEJ8ld%-@ddH`OuH zf`!O`P(YE4Mp+~Bk#>PrXQc<3trE(sfwD>oEQ5@cD++~zfRn+$YZsh3bqc4?UVx{f z{+X!D0b8Gpc7Msz#W=M4pE!MNA1Cgw7p0(8hZ5_ZNT2=9%W))Gr%cSekw-P8n1FA9 zz9{7_e{oucQiXd}Ponfo+M$5x;RWBEl!4XOE6BRin88uHP!EfcEX$ zAvtjmPJW((bsxMBm6sZ>X-VRAWnPcrhLbAUg*w3%%cMItC*rMI-y}UFdyvd=tZ`OvT!D@jU7@o+5H` z9^jSNhT-DnE6}JKaElzTsI;L=dkr?lui=qDcm6Vz8fvgVEjr%)8j5%h=OqN288-&lbyEVskorxiBGuZ3Q( zM`Y|0?D}L6W=2I~+T;-^t)T*FZoE=yGQjKs3`>Ji0zD5E6-J((aG?U2Uvilox3jbH zZQ6NyrJ?Y_0~8b%;rg8ie9Zm>$>`X#C*E5=8!8V4LWaJ8DbbNQkbIcmPd;)46Q{h5 zal;3pRV#O_S~45m2Mj?;aVfta5gvxpG6T}muW_Fa96Ewgqe6KRt*LRbE_xZN>}X5j z|GU5eRE%#@v|126Jc!>nnXFGF1DgzRQ_V&z&Mz#Wh?tI)gpK&>&~DtkbQXG20HI^X zfn{C+Rr1aq12}z@Ryk6!SN9$;7|KvkVMj?x2`P`R{5k`Jlq0%y>Vz7znP2PQBLIDS z^}^B5PoSX0i0u3K5I#N(wQMST!>P?^K}Ho*N3^ml=>#@y*^0_J%P#bw%?NzHCn~EYI4ctD zj-J%UkuTG*`tR#8I%FhfP8o$|3umLY){I$m9EDFyJ~UPaK2?C(0$6%kN!nfbE(70F zWlueqNfr7Sq9db8s*NCNCdb%O!7vmQV*1<_$jvuk^CyRqux&f0Ob+MsObQFb;k^me z03F0#x<7Ym9CELmgHq|JV3freJMs;bSCnJT>b00KZY-2CR+yYQC%}gqphG9lW8u=} zc$3t^!da7HsFC2SQDW1EHJomyMa3eoppq+^#+dU?4t3p{$pjr0CKbsYT7TW0$E}^e zj*n&FHDoL~S$Ein()ZuTkK@!g-*8=OqgQZfDAv69R~RiIz3q>^q)w(s&!BN%pqie) zG;SqkygdeGwBX2yk+^kd1?H0`jr+hC!-Ik_baVvGW#i9bomK}wPrNvA5UysNLul|Y zm}p+st+|ppIk|ZlH+mEn%zTq~m!@hvWrzSjDtznKzK?yM9wdq~5FTD=j5+P(*ddQM z3F?sW7@Ya~BxcT<35&(@GqLVL=M(qyadmEH&YJ)_wT-`Jh)PJq(oMrfM5nsbo+S8(g`bPm8a{ zuYc7AMzfW4c`fO34{9nzP~(LcgC~(*R^p4Kk5EY3-R??RF%G5xQhJDVrUBw~JEt>d ztZ7lJWn9G&OVEASZ9VJcoF7-x1AU2aGOpgkjCu2sed`Vsk|JOyDikb6a3=BoZ_|J*s=-aa`O3GbJD@T!YfX1Hnv+=AeBv7Tg_pZz}z%vJ%_)lECJX%16UkxEOyfzL?FO`0$s&-ZDM0>h7y z_%!Vyz-0um^DjB;jsr#U$Ef?MG52kh;%3XUJuYMcq4pvQp;Tw>d@0GghsE{j`yzlf z>lf+$OHN0UbLQH{$&zP%7AvE6+hiiHuKO%LOMe8U(s2>u&|<%c(UHqeF+eY*lDujG zxtWb&+CeAmc$7cv>wDtZwn{KR literal 0 HcmV?d00001 diff --git a/modules/ROOT/nav.adoc b/modules/ROOT/nav.adoc index 366559b36c..05bad34f08 100644 --- a/modules/ROOT/nav.adoc +++ b/modules/ROOT/nav.adoc @@ -258,6 +258,7 @@ **** xref:tinymceai-chat.adoc[Chat] **** xref:tinymceai-review.adoc[Review] **** xref:tinymceai-actions.adoc[Actions] +**** xref:tinymceai-multi-editor.adoc[Multi-editor mode] **** xref:tinymceai-models.adoc[AI models] **** xref:tinymceai-limits.adoc[Limits] **** xref:tinymceai-integration-options.adoc[Integration options] diff --git a/modules/ROOT/pages/8.10.0-release-notes.adoc b/modules/ROOT/pages/8.10.0-release-notes.adoc index 8eb25cd5a2..9ab9d1a6ce 100644 --- a/modules/ROOT/pages/8.10.0-release-notes.adoc +++ b/modules/ROOT/pages/8.10.0-release-notes.adoc @@ -71,6 +71,25 @@ The {productname} {release-version} release includes an accompanying release of For information on the **** plugin, see: xref:.adoc[]. +=== TinyMCE AI + +The {productname} {release-version} release includes an accompanying release of the **TinyMCE AI** premium plugin. + +**TinyMCE AI** includes the following addition. + +==== New multi-editor support +// #TINYMCE-14817 + +Previously, the **TinyMCE AI** plugin worked with one editor at a time. When related content was split across several editors on a page, users had to run Chat, Review, and Quick Actions in each editor separately, and the AI had no context from the other editors. + +In {productname} {release-version}, the **TinyMCE AI** plugin can group editors on the same page. Editors that share a xref:tinymceai.adoc#tinymceai_group[`+tinymceai_group+`] value share one Chat sidebar and one Review sidebar. Chat, Review, and Quick Actions work across the content of every editor in the group, and the plugin previews and applies each change in the editor it belongs to. The Review sidebar groups suggestions under the name of the editor they belong to. + +The xref:tinymceai.adoc#tinymceai_document_name[`+tinymceai_document_name+`] option names the content of each editor, and the xref:tinymceai.adoc#tinymceai_document_description[`+tinymceai_document_description+`] option describes that content to the AI service. Each editor filters the content returned by the AI through its own schema. + +For information on multi-editor mode, see xref:tinymceai-multi-editor.adoc[Multi-editor mode]. + +For information on the **TinyMCE AI** plugin, see: xref:tinymceai.adoc[TinyMCE AI]. + [[accompanying-premium-plugin-end-of-life-announcement]] == Accompanying Premium plugin end-of-life announcement diff --git a/modules/ROOT/pages/tinymceai-actions.adoc b/modules/ROOT/pages/tinymceai-actions.adoc index bad22cd5aa..5078a74be7 100644 --- a/modules/ROOT/pages/tinymceai-actions.adoc +++ b/modules/ROOT/pages/tinymceai-actions.adoc @@ -298,3 +298,4 @@ The https://tinymceai.api.tiny.cloud/docs#tag/Actions[Actions API] reference (in * xref:tinymceai-chat.adoc[AI Chat]: For interactive discussions with document analysis and context. * xref:tinymceai-review.adoc[AI Review]: For content quality analysis and improvement suggestions. +* xref:tinymceai-multi-editor.adoc[Multi-editor mode]: For sharing Chat, Review, and Quick Actions across several editors on one page. diff --git a/modules/ROOT/pages/tinymceai-chat.adoc b/modules/ROOT/pages/tinymceai-chat.adoc index e110299faa..ba69e993bb 100644 --- a/modules/ROOT/pages/tinymceai-chat.adoc +++ b/modules/ROOT/pages/tinymceai-chat.adoc @@ -287,3 +287,4 @@ The https://tinymceai.api.tiny.cloud/docs[interactive API documentation] lists e * xref:tinymceai-review.adoc[AI Review]: For content quality analysis and improvement suggestions. * xref:tinymceai-actions.adoc[Quick actions]: For fast, stateless content transformations. +* xref:tinymceai-multi-editor.adoc[Multi-editor mode]: For sharing Chat, Review, and Quick Actions across several editors on one page. diff --git a/modules/ROOT/pages/tinymceai-multi-editor.adoc b/modules/ROOT/pages/tinymceai-multi-editor.adoc new file mode 100644 index 0000000000..8f768fe781 --- /dev/null +++ b/modules/ROOT/pages/tinymceai-multi-editor.adoc @@ -0,0 +1,139 @@ += TinyMCE AI multi-editor mode +:navtitle: Multi-editor mode +:pluginname: TinyMCE AI +:plugincode: tinymceai +:description: Group several editors on one page so that they share TinyMCE AI Chat, Review, and Quick Actions +:description_short: multi-editor mode +:keywords: AI, multi-editor, multiple editors, group, tinymceai +:page-role: -toc + +include::partial$misc/admon-requires-8.10v.adoc[] + +Multi-editor mode groups several {productname} editors on the same page so that they share one Chat sidebar and one Review sidebar. Use multi-editor mode when a page splits related content across several editors, for example a form with separate editors for a summary and a body, or a page that edits several related articles side by side. + +In a group, Chat, Review, and Quick Actions work across the content of every editor. The {pluginname} plugin identifies the content of each editor by name, and previews and applies each change in the editor it belongs to. + +[[demo]] +== Demo + +The demo below splits an article across an Introduction editor and a Body editor in one group. Select the image:icons-premium/ai-assistant.svg[Chat icon,24px] Chat toolbar button in either editor to open the shared Chat sidebar, which the first editor hosts. Then ask the AI to change both parts of the article, or run a review over both editors. + +liveDemo::tinymceai-multi-editor[] + +include::partial$misc/admon-inline-not-supported.adoc[] + +[[how-grouped-editors-work]] +== How grouped editors work + +[[shared-sidebar]] +=== Shared sidebar + +The first editor of the group to be created hosts the shared Chat sidebar and Review sidebar. The Chat and Review toolbar buttons and menu items in every other editor of the group open, close, and focus that shared sidebar. + +[[chat]] +=== Chat + +By default, each chat prompt includes the content of every editor in the group. Each editor appears above the prompt as a context tag labeled with its xref:tinymceai.adoc#tinymceai_document_name[`+tinymceai_document_name+`] value, for example image:tinymceai/tinymceai-context-tag.png[Body context tag] for an editor named `+Body+`. + +Before sending the first message of a conversation, users can change which editors the AI works with: + +* Removing a context tag leaves the content of that editor out of the prompt, and the AI does not change that editor. +* The **Add context** menu lists every editor in the group and adds a removed editor back. + +After the first message, the editors in the conversation stay fixed until the user starts a new conversation. + +The AI can change the content of any editor in the group, and the plugin previews and applies each change in the editor it belongs to. To direct a request at the content of one editor, name that content in the prompt, for example _"Shorten the Introduction"_. For more information about chat, see xref:tinymceai-chat.adoc[Chat]. + +[[review]] +=== Review + +A review analyzes the content of every editor in the group. The Review sidebar groups suggestions under the name of the editor they belong to and shows the number of pending suggestions in each group. A review always covers the whole group. For more information about reviews, see xref:tinymceai-review.adoc[Review]. + +[[quick-actions]] +=== Quick Actions + +Users can run a Quick Action from any editor in the group. What the Quick Action changes depends on whether text is selected in that editor: + +* With text selected, the Quick Action changes only the selected text in that editor. +* With no text selected, the Quick Action changes the whole content of every editor in the group and ignores any text selected in the other editors. For example, running **Translate** with no text selected translates every editor in the group. + +Chat actions, such as **Explain**, **Summarize**, and **Highlight key points**, open the shared Chat sidebar and start a conversation that includes every editor in the group, as described in xref:#chat[Chat]. For more information about Quick Actions, see xref:tinymceai-actions.adoc[Quick Actions]. + +[[previewing-and-applying-changes]] +=== Previewing and applying changes + +While the {pluginname} plugin previews changes from Chat or Quick Actions, each affected editor shows its own preview and is read-only. The whole group shares one change toolbar: + +* The change counter covers the changes in every editor of the group. +* The next and previous buttons move between changes across editors. +* Selecting a change in any editor moves the change toolbar to that change. +* Accepting or rejecting a change applies it to the editor that holds the change. + +Each editor filters the content returned by the AI through its own schema, so a change applied to an editor contains only the elements and attributes that the editor allows. + +[[discarding-suggestions]] +=== Discarding pending suggestions + +When any editor in the group has pending suggestions, the {pluginname} plugin asks for confirmation before it discards them and starts a different AI task. For example, the confirmation appears when the user switches between the Chat sidebar and the Review sidebar, or runs a Quick Action while a review has pending suggestions. + +If the user confirms, the plugin discards the pending suggestions in every editor of the group and returns each editor to normal editing. If the user cancels, the plugin keeps every preview and pending suggestion. + +[[integration]] +== Integration + +To group editors, load the `+tinymceai+` plugin in each editor and set the same xref:tinymceai.adoc#tinymceai_group[`+tinymceai_group+`] value on each editor in the group. Give each editor a unique xref:tinymceai.adoc#tinymceai_document_name[`+tinymceai_document_name+`] value, and optionally a xref:tinymceai.adoc#tinymceai_document_description[`+tinymceai_document_description+`] value that describes the content to the AI. + +Use the same {pluginname} configuration for every editor in a group, for example by sharing a settings object between the `+tinymce.init+` calls: + +[source,js] +---- +const sharedSettings = { + plugins: 'tinymceai', + toolbar: 'tinymceai-chat tinymceai-quickactions tinymceai-review', + tinymceai_sidebar_type: 'floating', + tinymceai_group: 'article', + // Required for authentication + tinymceai_token_provider: () => { + return fetch('/api/token').then(r => r.text()).then(token => ({ token })); + } +}; + +tinymce.init({ + ...sharedSettings, + selector: 'textarea#introduction', // change this value according to the HTML + tinymceai_document_name: 'Introduction', + tinymceai_document_description: 'The introduction of the article. A short paragraph that sets out the topic and hooks the reader.' +}); + +tinymce.init({ + ...sharedSettings, + selector: 'textarea#body', // change this value according to the HTML + tinymceai_document_name: 'Body', + tinymceai_document_description: 'The main body of the article. Uses h2 subheadings and short paragraphs.' +}); +---- + +Grouped editors must be on the same page and use the same `+tinymce+` instance. Set xref:tinymceai.adoc#tinymceai_group[`+tinymceai_group+`] in the initial configuration of each editor. + +For information about installing the plugin and enabling AI features, see xref:tinymceai.adoc[Plugin Reference]. + +[[multiple-groups]] +=== Multiple groups on one page + +A page can contain several independent groups, each with a different xref:tinymceai.adoc#tinymceai_group[`+tinymceai_group+`] value. Each group has its own shared sidebar, and an editor in one group never receives the content of an editor in another group. + +The demo below splits one article across four editors in two groups. The Introduction and Native integration editors form one group, and the Workflow comparison and Adoption challenges editors form a second group. A chat in the first group cannot read or change the content of the second group. + +liveDemo::tinymceai-multi-editor-groups[] + +[[configuration]] +== Configuration + +For the options that configure multi-editor mode, see xref:tinymceai.adoc#options-multi-editor[Options for multi-editor mode]. + +[[related-features]] +== Related features + +* xref:tinymceai-chat.adoc[AI Chat]: For interactive discussions with document analysis and context. +* xref:tinymceai-review.adoc[AI Review]: For content quality analysis and improvement suggestions. +* xref:tinymceai-actions.adoc[Quick Actions]: For fast, stateless content transformations. diff --git a/modules/ROOT/pages/tinymceai-review.adoc b/modules/ROOT/pages/tinymceai-review.adoc index 2ceef933e9..738f1db662 100644 --- a/modules/ROOT/pages/tinymceai-review.adoc +++ b/modules/ROOT/pages/tinymceai-review.adoc @@ -134,3 +134,4 @@ The https://tinymceai.api.tiny.cloud/docs#tag/Reviews[Reviews API] reference (in * xref:tinymceai-chat.adoc[AI chat]: For interactive discussions with document analysis and context. * xref:tinymceai-actions.adoc[Quick actions]: Shortcuts to individual AI operations on a selection or range (transformations, translation, chat, and custom actions). +* xref:tinymceai-multi-editor.adoc[Multi-editor mode]: For sharing Chat, Review, and Quick Actions across several editors on one page. diff --git a/modules/ROOT/partials/configuration/tinymceai_options.adoc b/modules/ROOT/partials/configuration/tinymceai_options.adoc index 73902da544..263d15d489 100644 --- a/modules/ROOT/partials/configuration/tinymceai_options.adoc +++ b/modules/ROOT/partials/configuration/tinymceai_options.adoc @@ -847,3 +847,135 @@ tinymceai_reviews: [ ] ---- +[[options-multi-editor]] +== Options for multi-editor mode + +These options group several editors on the same page so that they share one Chat sidebar and one Review sidebar, and identify the content of each editor to users and to the AI service. For a description of how grouped editors work, see xref:tinymceai-multi-editor.adoc[Multi-editor mode]. + +include::partial$misc/admon-requires-8.10v.adoc[] + +[[tinymceai_group]] +=== `+tinymceai_group+` + +Adds the editor to a named group. Editors on the same page with the same `+tinymceai_group+` value share one Chat sidebar and one Review sidebar. In a group, Chat, Review, and Quick Actions work across the content of every editor. The editor created first in the group hosts the shared sidebars. + +The plugin uses the group name only to match editors, and never shows the name to users or sends it to the AI service. A page can contain several independent groups, each with a different name. Editors in one group never receive content from another group. + +An editor without this option does not belong to any group. It has its own Chat sidebar and Review sidebar, and works only with its own content, even when other editors on the same page belong to a group. + +For more details and live demos, see xref:tinymceai-multi-editor.adoc[Multi-editor mode]. + +*Type:* `+String+` + +*Default value:* `+undefined+` + +.Example: two independent groups on one page +[source,js] +---- +const sharedSettings = { + plugins: 'tinymceai', + toolbar: 'tinymceai-chat tinymceai-quickactions tinymceai-review', + // Required for authentication + tinymceai_token_provider: () => { + return fetch('/api/token').then(r => r.text()).then(token => ({ token })); + } +}; + +// Group "article": the introduction and body editors share one AI sidebar. +tinymce.init({ + ...sharedSettings, + selector: 'textarea#introduction', // change this value according to the HTML + tinymceai_group: 'article' +}); + +tinymce.init({ + ...sharedSettings, + selector: 'textarea#body', // change this value according to the HTML + tinymceai_group: 'article' +}); + +// Group "notes": a separate AI sidebar that never receives the content of the "article" group. +tinymce.init({ + ...sharedSettings, + selector: 'textarea#research-notes', // change this value according to the HTML + tinymceai_group: 'notes' +}); + +tinymce.init({ + ...sharedSettings, + selector: 'textarea#review-notes', // change this value according to the HTML + tinymceai_group: 'notes' +}); +---- + +[NOTE] +==== +Set this option in the initial configuration of the editor. Changing this option after the editor initializes is not supported. +==== + +[[tinymceai_document_name]] +=== `+tinymceai_document_name+` + +The name of the content in the editor. The {pluginname} plugin uses this name to: + +* Label the content of the editor in the Chat sidebar, including the context tags of a prompt and the chat history. +* Label the group of suggestions for the editor in the Review sidebar. +* Name the content that the plugin sends to the AI service with a chat prompt, so that the AI can refer to it and tell it apart from the content of other editors. +* Match each editor to its content when a user resumes a conversation from the chat history. + +When this option is not set, the plugin uses the editor ID as the name, for example `+mce_0+` or the ID of the target element. Set a descriptive name for each editor in a group, because an editor ID does not identify the content to users or to the AI service. + +The plugin removes leading and trailing whitespace from the value. A value that is empty or longer than 255 characters is not valid. When the value is not valid, {productname} logs a warning to the browser console and the plugin uses the editor ID instead. + +*Type:* `+String+` + +*Default value:* `+undefined+` + +.Example +[source,js] +---- +tinymce.init({ + selector: 'textarea', // change this value according to the HTML + plugins: 'tinymceai', + toolbar: 'tinymceai-chat tinymceai-quickactions tinymceai-review', + tinymceai_group: 'report', + tinymceai_document_name: 'Executive summary', + // Required for authentication + tinymceai_token_provider: () => { + return fetch('/api/token').then(r => r.text()).then(token => ({ token })); + } +}); +---- + +[IMPORTANT] +==== +Give each editor in a group a unique name, and keep each name the same across page loads. When a user resumes a conversation from the chat history, the plugin matches the stored content to editors by name. If two editors in a group share a name, the plugin can match content to the wrong editor. If a name changes, the plugin no longer matches conversations saved with the previous name to that editor. +==== + +[[tinymceai_document_description]] +=== `+tinymceai_document_description+` + +A short description of the content in the editor, such as its purpose, format, length limits, or audience. The {pluginname} plugin sends the description to the AI service with the content of the editor when a user submits a chat prompt. The AI uses the description as additional context, for example to keep a title short or to apply a change only to the relevant content. + +Users do not see the description. + +*Type:* `+String+` + +*Default value:* `+undefined+` + +.Example +[source,js] +---- +tinymce.init({ + selector: 'textarea', // change this value according to the HTML + plugins: 'tinymceai', + toolbar: 'tinymceai-chat tinymceai-quickactions tinymceai-review', + tinymceai_group: 'blog-post', + tinymceai_document_name: 'Blog post body', + tinymceai_document_description: 'The main body of the blog post. Uses h2 subheadings and short paragraphs.', + // Required for authentication + tinymceai_token_provider: () => { + return fetch('/api/token').then(r => r.text()).then(token => ({ token })); + } +}); +---- diff --git a/modules/ROOT/partials/misc/admon-requires-8.10v.adoc b/modules/ROOT/partials/misc/admon-requires-8.10v.adoc new file mode 100644 index 0000000000..8cfaa251e1 --- /dev/null +++ b/modules/ROOT/partials/misc/admon-requires-8.10v.adoc @@ -0,0 +1 @@ +NOTE: This feature is only available for {productname} 8.10 and later. From 8341f7b9ccdfb7a91f414e98dd647c1865b06049 Mon Sep 17 00:00:00 2001 From: Karl Kemister-Sheppard Date: Mon, 12 Oct 2026 11:51:58 +1000 Subject: [PATCH 2/6] TINYDOC-3639: Remove per-editor schema filtering note from multi-editor docs. --- modules/ROOT/pages/8.10.0-release-notes.adoc | 2 +- modules/ROOT/pages/tinymceai-multi-editor.adoc | 2 -- 2 files changed, 1 insertion(+), 3 deletions(-) diff --git a/modules/ROOT/pages/8.10.0-release-notes.adoc b/modules/ROOT/pages/8.10.0-release-notes.adoc index 9ab9d1a6ce..28262106cd 100644 --- a/modules/ROOT/pages/8.10.0-release-notes.adoc +++ b/modules/ROOT/pages/8.10.0-release-notes.adoc @@ -84,7 +84,7 @@ Previously, the **TinyMCE AI** plugin worked with one editor at a time. When rel In {productname} {release-version}, the **TinyMCE AI** plugin can group editors on the same page. Editors that share a xref:tinymceai.adoc#tinymceai_group[`+tinymceai_group+`] value share one Chat sidebar and one Review sidebar. Chat, Review, and Quick Actions work across the content of every editor in the group, and the plugin previews and applies each change in the editor it belongs to. The Review sidebar groups suggestions under the name of the editor they belong to. -The xref:tinymceai.adoc#tinymceai_document_name[`+tinymceai_document_name+`] option names the content of each editor, and the xref:tinymceai.adoc#tinymceai_document_description[`+tinymceai_document_description+`] option describes that content to the AI service. Each editor filters the content returned by the AI through its own schema. +The xref:tinymceai.adoc#tinymceai_document_name[`+tinymceai_document_name+`] option names the content of each editor, and the xref:tinymceai.adoc#tinymceai_document_description[`+tinymceai_document_description+`] option describes that content to the AI service. For information on multi-editor mode, see xref:tinymceai-multi-editor.adoc[Multi-editor mode]. diff --git a/modules/ROOT/pages/tinymceai-multi-editor.adoc b/modules/ROOT/pages/tinymceai-multi-editor.adoc index 8f768fe781..bcfa2c530c 100644 --- a/modules/ROOT/pages/tinymceai-multi-editor.adoc +++ b/modules/ROOT/pages/tinymceai-multi-editor.adoc @@ -69,8 +69,6 @@ While the {pluginname} plugin previews changes from Chat or Quick Actions, each * Selecting a change in any editor moves the change toolbar to that change. * Accepting or rejecting a change applies it to the editor that holds the change. -Each editor filters the content returned by the AI through its own schema, so a change applied to an editor contains only the elements and attributes that the editor allows. - [[discarding-suggestions]] === Discarding pending suggestions From 18697a333b979d5e8703ead87e879284b7a9047e Mon Sep 17 00:00:00 2001 From: Karl Kemister-Sheppard Date: Tue, 13 Oct 2026 09:37:16 +1000 Subject: [PATCH 3/6] TINYDOC-3639: Resize multi-editor demos, restore the TOC, document floating sidebar support, and remove the groups demo from the page. --- .../tinymceai-multi-editor-groups/example.js | 4 ++-- .../tinymceai-multi-editor-groups/index.html | 19 ++++++++++++------- .../tinymceai-multi-editor-groups/index.js | 4 ++-- .../tinymceai-multi-editor/example.js | 4 ++-- .../tinymceai-multi-editor/index.html | 6 ++++-- .../tinymceai-multi-editor/index.js | 4 ++-- .../ROOT/pages/tinymceai-multi-editor.adoc | 9 +++------ 7 files changed, 27 insertions(+), 23 deletions(-) diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/example.js b/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/example.js index e2dcbc7e4f..1e6f3cbbe6 100644 --- a/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/example.js +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/example.js @@ -2,9 +2,9 @@ // Open-source plugins below are only for editing the demo HTML (lists, links, tables). TinyMCE AI options are the focus. // Share one TinyMCE AI configuration between every editor. Each editor sets its own group, so the page holds two independent groups. const sharedSettings = { - height: '600px', + height: '400px', plugins: ['tinymceai', 'advlist', 'lists', 'link', 'autolink', 'table', 'wordcount'], - toolbar: 'undo redo | tinymceai-chat ai-quickactions-translate tinymceai-review | styles | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link', + toolbar: 'undo redo | tinymceai-chat tinymceai-review ai-quickactions-translate | styles | bold italic | bullist numlist | link', tinymceai_sidebar_type: 'floating', tinymceai_chat_welcome_message: '

Welcome to TinyMCE AI. Pick an action below or type your own prompt.

', tinymceai_chat_welcome_actions: [ diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.html b/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.html index 9b05f4f4b3..a64691acbf 100644 --- a/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.html +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.html @@ -1,4 +1,7 @@ -

Group "article-opening", editor 1: Introduction (hosts the AI sidebar of the group)

+
+
+

Group 1: article-opening

+

Introduction (hosts the AI sidebar of group 1)

-

Group "article-opening", editor 2: Native integration (shares the AI sidebar of the Introduction editor)

+

Native integration (shares the AI sidebar of group 1)

- -
- -

Group "article-analysis", editor 3: Workflow comparison (hosts the AI sidebar of the group)

+
+
+

Group 2: article-analysis

+

Workflow comparison (hosts the AI sidebar of group 2)

-

Group "article-analysis", editor 4: Adoption challenges (shares the AI sidebar of the Workflow comparison editor)

+

Adoption challenges (shares the AI sidebar of group 2)

+
+
diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.js b/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.js index 31c237dde3..5eec82ad4b 100644 --- a/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.js +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor-groups/index.js @@ -48,12 +48,12 @@ const createRevisionHistoryFetch = (selector) => () => { // Share one TinyMCE AI configuration between every editor. Each editor sets its own group, so the page holds two independent groups. const sharedSettings = { - height: '600px', + height: '400px', plugins: [ 'autolink', 'link', 'emoticons', 'lists', 'table', 'advlist', 'searchreplace', 'wordcount', 'autocorrect', 'tinymcespellchecker', 'charmap', 'fullscreen', 'advcode', 'accordion', 'anchor', 'footnotes', 'powerpaste', 'importword', 'exportpdf', 'exportword', 'markdown', 'a11ychecker', 'typography', 'casechange', 'checklist', 'advtable', 'formatpainter', 'permanentpen', 'tableofcontents', 'help', 'math', 'linkchecker', 'media', 'mediaembed', 'quickbars', 'tinymceai', 'tinycomments', 'mentions', 'revisionhistory', 'suggestededits', 'uploadcare' ], - toolbar: 'undo redo | tinymceai-chat tinymceai-review ai-quickactions-translate spellchecker | styles | bold italic underline forecolor backcolor casechange | link uploadcare table addcomment | align bullist numlist checklist removeformat | code fullscreen help', + toolbar: 'undo redo | tinymceai-chat tinymceai-review ai-quickactions-translate | styles | bold italic | bullist numlist | link', tinymceai_sidebar_type: 'floating', quickbars_selection_toolbar: 'tinymceai-quickactions addcomment', tinymceai_chat_welcome_message: '

Welcome to TinyMCE AI. Pick an action below or type your own prompt.

', diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/example.js b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/example.js index 6aadfe8360..60bf5f8443 100644 --- a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/example.js +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/example.js @@ -2,9 +2,9 @@ // Open-source plugins below are only for editing the demo HTML (lists, links, tables). TinyMCE AI options are the focus. // Share one TinyMCE AI configuration between every editor in the group. const sharedSettings = { - height: '800px', + height: '400px', plugins: ['tinymceai', 'advlist', 'lists', 'link', 'autolink', 'table', 'wordcount'], - toolbar: 'undo redo | tinymceai-chat ai-quickactions-translate tinymceai-review | styles | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link', + toolbar: 'undo redo | tinymceai-chat tinymceai-review ai-quickactions-translate | styles | bold italic | bullist numlist | link', tinymceai_sidebar_type: 'floating', tinymceai_chat_welcome_message: '

Welcome to TinyMCE AI. Pick an action below or type your own prompt.

', tinymceai_chat_welcome_actions: [ diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.html b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.html index 99bdd97b18..bb2e80d29f 100644 --- a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.html +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.html @@ -1,4 +1,5 @@ -

Editor 1: Introduction (hosts the shared AI sidebar)

+
+

Introduction (hosts the shared AI sidebar)

-

Editor 2: Body (shares the AI sidebar of editor 1)

+

Body (shares the AI sidebar of the Introduction editor)

+
diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.js b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.js index a601d843ed..600056c785 100644 --- a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.js +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.js @@ -48,12 +48,12 @@ const createRevisionHistoryFetch = (selector) => () => { // Share one TinyMCE AI configuration between every editor in the group. const sharedSettings = { - height: '800px', + height: '400px', plugins: [ 'autolink', 'link', 'emoticons', 'lists', 'table', 'advlist', 'searchreplace', 'wordcount', 'autocorrect', 'tinymcespellchecker', 'charmap', 'fullscreen', 'advcode', 'accordion', 'anchor', 'footnotes', 'powerpaste', 'importword', 'exportpdf', 'exportword', 'markdown', 'a11ychecker', 'typography', 'casechange', 'checklist', 'advtable', 'formatpainter', 'permanentpen', 'tableofcontents', 'help', 'math', 'linkchecker', 'media', 'mediaembed', 'quickbars', 'tinymceai', 'tinycomments', 'mentions', 'revisionhistory', 'suggestededits', 'uploadcare' ], - toolbar: 'undo redo | tinymceai-chat tinymceai-review ai-quickactions-translate spellchecker | styles | bold italic underline forecolor backcolor casechange | link uploadcare table addcomment | align bullist numlist checklist removeformat | code fullscreen help', + toolbar: 'undo redo | tinymceai-chat tinymceai-review ai-quickactions-translate | styles | bold italic | bullist numlist | link', tinymceai_sidebar_type: 'floating', quickbars_selection_toolbar: 'tinymceai-quickactions addcomment', tinymceai_chat_welcome_message: '

Welcome to TinyMCE AI. Pick an action below or type your own prompt.

', diff --git a/modules/ROOT/pages/tinymceai-multi-editor.adoc b/modules/ROOT/pages/tinymceai-multi-editor.adoc index bcfa2c530c..2ad5daef0d 100644 --- a/modules/ROOT/pages/tinymceai-multi-editor.adoc +++ b/modules/ROOT/pages/tinymceai-multi-editor.adoc @@ -5,7 +5,6 @@ :description: Group several editors on one page so that they share TinyMCE AI Chat, Review, and Quick Actions :description_short: multi-editor mode :keywords: AI, multi-editor, multiple editors, group, tinymceai -:page-role: -toc include::partial$misc/admon-requires-8.10v.adoc[] @@ -38,7 +37,7 @@ By default, each chat prompt includes the content of every editor in the group. Before sending the first message of a conversation, users can change which editors the AI works with: * Removing a context tag leaves the content of that editor out of the prompt, and the AI does not change that editor. -* The **Add context** menu lists every editor in the group and adds a removed editor back. +* The **Add context source** menu lists every editor in the group and adds a removed editor back. After the first message, the editors in the conversation stay fixed until the user starts a new conversation. @@ -81,6 +80,8 @@ If the user confirms, the plugin discards the pending suggestions in every edito To group editors, load the `+tinymceai+` plugin in each editor and set the same xref:tinymceai.adoc#tinymceai_group[`+tinymceai_group+`] value on each editor in the group. Give each editor a unique xref:tinymceai.adoc#tinymceai_document_name[`+tinymceai_document_name+`] value, and optionally a xref:tinymceai.adoc#tinymceai_document_description[`+tinymceai_document_description+`] value that describes the content to the AI. +Multi-editor mode is supported with the floating sidebar. Set xref:tinymceai.adoc#tinymceai_sidebar_type[`+tinymceai_sidebar_type+`] to `+'floating'+` for every editor in the group. + Use the same {pluginname} configuration for every editor in a group, for example by sharing a settings object between the `+tinymce.init+` calls: [source,js] @@ -120,10 +121,6 @@ For information about installing the plugin and enabling AI features, see xref:t A page can contain several independent groups, each with a different xref:tinymceai.adoc#tinymceai_group[`+tinymceai_group+`] value. Each group has its own shared sidebar, and an editor in one group never receives the content of an editor in another group. -The demo below splits one article across four editors in two groups. The Introduction and Native integration editors form one group, and the Workflow comparison and Adoption challenges editors form a second group. A chat in the first group cannot read or change the content of the second group. - -liveDemo::tinymceai-multi-editor-groups[] - [[configuration]] == Configuration From ebc76578466bfc32b6f574b027cede993d70bf92 Mon Sep 17 00:00:00 2001 From: Karl Kemister-Sheppard Date: Tue, 13 Oct 2026 09:44:30 +1000 Subject: [PATCH 4/6] TINYDOC-3639: Align multi-editor examples with the floating sidebar, link the two-group example, and restore the full-width demo. --- .../examples/live-demos/tinymceai-multi-editor/example.js | 3 +-- .../examples/live-demos/tinymceai-multi-editor/index.html | 6 ++---- modules/ROOT/pages/tinymceai-multi-editor.adoc | 4 ++-- modules/ROOT/partials/configuration/tinymceai_options.adoc | 3 ++- 4 files changed, 7 insertions(+), 9 deletions(-) diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/example.js b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/example.js index 60bf5f8443..59f9baea49 100644 --- a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/example.js +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/example.js @@ -1,4 +1,3 @@ -// Step 1: Set up session - this should be part of the application's user management process. // Open-source plugins below are only for editing the demo HTML (lists, links, tables). TinyMCE AI options are the focus. // Share one TinyMCE AI configuration between every editor in the group. const sharedSettings = { @@ -15,7 +14,7 @@ const sharedSettings = { { title: 'Review my document', command: 'ToggleSidebar', value: 'tinymceai-review' } ], tinymceai_token_provider: async () => { - return fetch('/api/tinymceai-token', { credentials: 'include' }) + return fetch('/api/token', { credentials: 'include' }) .then(resp => resp.text()) .then(token => ({ token })); }, diff --git a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.html b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.html index bb2e80d29f..6c2a5ef576 100644 --- a/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.html +++ b/modules/ROOT/examples/live-demos/tinymceai-multi-editor/index.html @@ -1,5 +1,4 @@ -
-

Introduction (hosts the shared AI sidebar)

+

Introduction (first editor in the group)

-

Body (shares the AI sidebar of the Introduction editor)

+

Body (shares the AI sidebar with the Introduction)

-
diff --git a/modules/ROOT/pages/tinymceai-multi-editor.adoc b/modules/ROOT/pages/tinymceai-multi-editor.adoc index 2ad5daef0d..70c7d779fa 100644 --- a/modules/ROOT/pages/tinymceai-multi-editor.adoc +++ b/modules/ROOT/pages/tinymceai-multi-editor.adoc @@ -41,7 +41,7 @@ Before sending the first message of a conversation, users can change which edito After the first message, the editors in the conversation stay fixed until the user starts a new conversation. -The AI can change the content of any editor in the group, and the plugin previews and applies each change in the editor it belongs to. To direct a request at the content of one editor, name that content in the prompt, for example _"Shorten the Introduction"_. For more information about chat, see xref:tinymceai-chat.adoc[Chat]. +The AI can change the content of any editor in the conversation, and the plugin previews and applies each change in the editor it belongs to. To direct a request at the content of one editor, name that content in the prompt, for example _"Shorten the Introduction"_. For more information about chat, see xref:tinymceai-chat.adoc[Chat]. [[review]] === Review @@ -119,7 +119,7 @@ For information about installing the plugin and enabling AI features, see xref:t [[multiple-groups]] === Multiple groups on one page -A page can contain several independent groups, each with a different xref:tinymceai.adoc#tinymceai_group[`+tinymceai_group+`] value. Each group has its own shared sidebar, and an editor in one group never receives the content of an editor in another group. +A page can contain several independent groups, each with a different xref:tinymceai.adoc#tinymceai_group[`+tinymceai_group+`] value. Each group has its own shared sidebar, and an editor in one group never receives the content of an editor in another group. For a configuration with two groups, see the xref:tinymceai.adoc#tinymceai_group[two-group example]. [[configuration]] == Configuration diff --git a/modules/ROOT/partials/configuration/tinymceai_options.adoc b/modules/ROOT/partials/configuration/tinymceai_options.adoc index 263d15d489..76b9e1ad88 100644 --- a/modules/ROOT/partials/configuration/tinymceai_options.adoc +++ b/modules/ROOT/partials/configuration/tinymceai_options.adoc @@ -863,7 +863,7 @@ The plugin uses the group name only to match editors, and never shows the name t An editor without this option does not belong to any group. It has its own Chat sidebar and Review sidebar, and works only with its own content, even when other editors on the same page belong to a group. -For more details and live demos, see xref:tinymceai-multi-editor.adoc[Multi-editor mode]. +For more details and a live demo, see xref:tinymceai-multi-editor.adoc[Multi-editor mode]. *Type:* `+String+` @@ -875,6 +875,7 @@ For more details and live demos, see xref:tinymceai-multi-editor.adoc[Multi-edit const sharedSettings = { plugins: 'tinymceai', toolbar: 'tinymceai-chat tinymceai-quickactions tinymceai-review', + tinymceai_sidebar_type: 'floating', // Required for authentication tinymceai_token_provider: () => { return fetch('/api/token').then(r => r.text()).then(token => ({ token })); From 4003ed40e83a1f882f061f507986fa8ec771e453 Mon Sep 17 00:00:00 2001 From: Karl Kemister-Sheppard Date: Tue, 13 Oct 2026 21:48:57 +1000 Subject: [PATCH 5/6] Update modules/ROOT/pages/tinymceai-multi-editor.adoc Co-authored-by: Millie --- modules/ROOT/pages/tinymceai-multi-editor.adoc | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/modules/ROOT/pages/tinymceai-multi-editor.adoc b/modules/ROOT/pages/tinymceai-multi-editor.adoc index 70c7d779fa..1b94f68f23 100644 --- a/modules/ROOT/pages/tinymceai-multi-editor.adoc +++ b/modules/ROOT/pages/tinymceai-multi-editor.adoc @@ -71,7 +71,7 @@ While the {pluginname} plugin previews changes from Chat or Quick Actions, each [[discarding-suggestions]] === Discarding pending suggestions -When any editor in the group has pending suggestions, the {pluginname} plugin asks for confirmation before it discards them and starts a different AI task. For example, the confirmation appears when the user switches between the Chat sidebar and the Review sidebar, or runs a Quick Action while a review has pending suggestions. +When any editor in the group has pending suggestions, the {pluginname} plugin asks for confirmation before it discards them and starts a different AI task. For example, the confirmation dialog appears when the user switches between the Chat sidebar and the Review sidebar, or runs a Quick Action while a review has pending suggestions. If the user confirms, the plugin discards the pending suggestions in every editor of the group and returns each editor to normal editing. If the user cancels, the plugin keeps every preview and pending suggestion. From 690feb3f44cd53bf4c7bb491aa61769600324d4d Mon Sep 17 00:00:00 2001 From: Karl Kemister-Sheppard Date: Wed, 14 Oct 2026 09:01:30 +1000 Subject: [PATCH 6/6] TINYDOC-3639: Clarify that editors can be added to a multi-editor chat after the first message, and mention Quick Actions in the options introduction. --- modules/ROOT/pages/tinymceai-multi-editor.adoc | 4 ++-- modules/ROOT/partials/configuration/tinymceai_options.adoc | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/modules/ROOT/pages/tinymceai-multi-editor.adoc b/modules/ROOT/pages/tinymceai-multi-editor.adoc index 1b94f68f23..417a9fd0fd 100644 --- a/modules/ROOT/pages/tinymceai-multi-editor.adoc +++ b/modules/ROOT/pages/tinymceai-multi-editor.adoc @@ -34,12 +34,12 @@ The first editor of the group to be created hosts the shared Chat sidebar and Re By default, each chat prompt includes the content of every editor in the group. Each editor appears above the prompt as a context tag labeled with its xref:tinymceai.adoc#tinymceai_document_name[`+tinymceai_document_name+`] value, for example image:tinymceai/tinymceai-context-tag.png[Body context tag] for an editor named `+Body+`. -Before sending the first message of a conversation, users can change which editors the AI works with: +Users can change which editors the AI works with: * Removing a context tag leaves the content of that editor out of the prompt, and the AI does not change that editor. * The **Add context source** menu lists every editor in the group and adds a removed editor back. -After the first message, the editors in the conversation stay fixed until the user starts a new conversation. +After a message is sent, the editors included in that message stay in the conversation and their context tags cannot be removed until the user starts a new conversation. Editors that were left out can still be added from the **Add context source** menu at any point in the conversation. The AI can change the content of any editor in the conversation, and the plugin previews and applies each change in the editor it belongs to. To direct a request at the content of one editor, name that content in the prompt, for example _"Shorten the Introduction"_. For more information about chat, see xref:tinymceai-chat.adoc[Chat]. diff --git a/modules/ROOT/partials/configuration/tinymceai_options.adoc b/modules/ROOT/partials/configuration/tinymceai_options.adoc index 76b9e1ad88..b1664d75ae 100644 --- a/modules/ROOT/partials/configuration/tinymceai_options.adoc +++ b/modules/ROOT/partials/configuration/tinymceai_options.adoc @@ -850,7 +850,7 @@ tinymceai_reviews: [ [[options-multi-editor]] == Options for multi-editor mode -These options group several editors on the same page so that they share one Chat sidebar and one Review sidebar, and identify the content of each editor to users and to the AI service. For a description of how grouped editors work, see xref:tinymceai-multi-editor.adoc[Multi-editor mode]. +These options group several editors on the same page so that they share one Chat sidebar and one Review sidebar, and Chat, Review, and Quick Actions work across the content of every editor in the group. The options also identify the content of each editor to users and to the AI service. For a description of how grouped editors work, see xref:tinymceai-multi-editor.adoc[Multi-editor mode]. include::partial$misc/admon-requires-8.10v.adoc[]