Skip to content

Commit 263e789

Browse files
kemister85metricjskimwoodfield
authored
DOC-3356: New feature documentation for tinymceai. (#3976)
* DOC-3243: TinyMCE 8.4.0 Release Documentation and Community Changelog. * DOC-3356: Initial file setup. * DOC-3356: Initial documentation structure and layout content. * DOC-3356: Add JWT authentication guides for plugin, major content changes and improvements. * DOC-3356: Update premium plugins link to point to intro page. * DOC-3358: Restructure JWT guides, fix broken partials across JWT guides. * DOC-3356: Suggested improvements, copy edits and initial review changes. * DOC-3356: Update, improve example and context around tinymceai_quickactions_menu. * DOC-3356: Restructure JWT auth docs, add permissions page with tables, move security content to intro, fix API quick start links. * DOC-3356: Move limits and models in nav.adoc file. * DOC-3356: Refactor JWT intro page to include refinded details for tinymceai. * DOC-3356: Update options, fetch examples for JWT. * DOC-3356: Remove toolbar button identifiers for buttons missing icons. * Fix llms-full.txt URL in generated llms.txt (#4004) The llms-full.txt link was incorrectly pointing to https://www.tiny.cloud/docs/tinymce/latest/llms-full.txt It should point to https://www.tiny.cloud/docs/llms-full.txt since llms-full.txt is served at the docs root. - Add DOCS_ROOT_URL constant for docs-root-level URLs - Use DOCS_ROOT_URL for llms-full.txt link in generated output - Update README-llm-files.md with correct URL - Fix current llms.txt attachment * DOC-3356: Add svg icons restructure tinymceai options into buckets update commands remove review options placeholder rename options, controls * DOC-3356: Update init content for tinymceai demo. * DOC-3356: Update icons and icon_list. * DOC-3356: Add missing tinymceai_languages option and adhoc fixed. * DOC-3356: copy edits, context styling corrections. * DOC-3356: Adding -toc page-role to tinymceai demo pages to hide TOC DOC-3356: Fix broken h1 titles. * DOC-3356: Add note about permissions, and model-configuration to JWT guides. * DOC-3356: Add missing chat_welcome_message option and update JWT about auth login comment. * DOC-3356: update events.adoc to remove mention of tinymceai events * Document tinymceai_reviews option and improve TinyMCE AI docs accuracy - Add tinymceai_reviews config option to Options for Review section - Fix broken xref and clarify Actions vs Reviews behavior in actions-plugin - Add Configuration section with tinymceai_reviews reference to Review page - Fix informal wording and contractions in api-overview and models pages - Update Review related-features description for Quick actions * DOC-3356: Oxide-only icon list, premium icons in icons-premium, TinyMCE AI doc fixes - Regenerate icon_list.adoc from oxide-icons-default only - Move premium-only icons to modules/ROOT/images/icons-premium/ - Update TinyMCE AI docs to reference icons-premium for premium icons - Fix tinymceai-rest-api :pluginname: placement, JWT guide duplicate IDs - Escape ${id} in TinyMCE AI code examples - Fix uploadcare-image revert icon reference (revert-changes) - Fix tinydrive-getting-started leveloffset on include * Update TinyMCE AI demos per documentation strategy - Add tinymceai-review demo with sidebar_show: tinymceai-review - Add tinymceai-actions demo with tinymceai-quickactions in toolbar - Update main tinymceai demo toolbar to ai-quickactions-translate - Replace tinymceai demo content with GenAI workflow article - Add tinymceai config: chat fetch sources, custom actions, languages - Add example.js for tinymceai-review and tinymceai-actions demos - Remove broken xref:tinymceai-events from events.adoc * Improve TinyMCE AI docs clarity without removing content - Clarify pronouns and referents (AI, web search, reasoning, endpoint) - Add context for integration options, architecture, and token endpoint - Tighten custom actions description and model capabilities section - Fix progress-tracking xref to Review streaming section - Minor style fixes per CONTRIBUTING guidelines * Use colon instead of dash for TinyMCE AI list item format Standardize label: description format across tinymceai pages, partials, and JWT guides. Replaces hyphen and en dash with colon for consistency with docs conventions. No content removed. * Fix translate action docs: use language names not ISO codes - Correct REST API translate action: args.language expects names (english, spanish, etc.) not ISO 639-1 codes - Document single 'translate' action with language parameter - Add keyboard shortcuts section (Ctrl+J/Cmd+J for chat) - Fix 'To set up' grammar and introduction typo * TinyMCE AI docs: improve intro, on-premises section, remove unused REST API page, fix menu items ordering - tinymceai-introduction: emphasize Cloud-only for AI service, improve on-premises section with intro and contact link - Remove unused tinymceai-rest-api.adoc page - available-menu-items: fix alphabetical ordering of all plugins * TinyMCE AI docs: link plugin config to tinymceai.adoc, remove redundant API links from intros * TinyMCE AI docs: models page improvements, Actions TIP, options format - tinymceai-models: add plugin config example, expand Model Limitations (web scraping, file limits, moderation, descriptions), Checking Compatibility links and plugin-first order - tinymceai-actions-plugin: add TIP for Actions vs Reviews - tinymceai_options: use colon format for list items, add spacing * TinyMCE AI API quick start: fix JWT credentials instructions - Remove references to non-existent Environments management guide - Update instructions to match Customer Portal JWT Keys UI (Generate New Keypair, Add Key, Import Public Key) - Update image alt text to describe JWT Keys page sections * DOC-3356: JWT PHP guide - fix heredoc formatting, use time() for iat/exp, remove POST-only check * DOC-3356: Add trial demo identity service to JWT guide - Document demo identity service quick start and trial JWT examples - Link API quick start to JWT trial section; use Antora URL attributes - Use no-api-key placeholder in JWT payload example; normalize source blocks * DOC-3356: Clarify tinymceai_token_provider return shape in models example Use plain-text token response in sample code and note JSON endpoint alternative (review feedback on tinymceai-models.adoc). * DOC-3356: Deduplicate AI API reference sections and unify Quick Actions table - Merge default actions list with system-actions checkmark table; xref from Actions API - Tighten Chat, Review, Streaming API reference blocks to single OpenAPI links where redundant * DOC-3356: Document TinyMCE AI model limits via Models API - Add verifying limits procedure and file-processing guidance from GET /v1/models - Remove hardcoded file size counts from limits page; point to API and OpenAPI - Expand Model Information with fetch/curl examples, response field notes, CORS note - Link API quick start to verifying model limits; tighten API reference section * DOC-3356: Stack multi-action API names in Quick Actions table Use AsciiDoc a| cells with hard breaks for Adjust length and Adjust Tone so action identifiers do not wrap awkwardly. * docs: add TinyMCE AI screenshots and update plugin pages - Replace placeholder images with Customer Portal, chat, review, and quick actions screenshots - Align review bar copy with product strings (Apply remaining, Skip remaining) - Set figure width to 80% for tinymceai images * docs: set TinyMCE AI live demo editor height to 800px * Update modules/ROOT/partials/commands/tinymceai-cmds.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/configuration/tinymceai_options.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/configuration/tinymceai_options.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/configuration/tinymceai_options.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/configuration/tinymceai_options.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/configuration/tinymceai_options.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/menu-item-ids/tinymceai-menu-items.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/toolbar-button-ids/tinymceai-toolbar-buttons.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/toolbar-button-ids/tinymceai-toolbar-buttons.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/configuration/tinymceai_options.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Docs: TinyMCE AI updates from review feedback - Nav: move legacy AI Assistant under TinyMCE AI; rename plugin nav to Plugin configuration - Introduction: early access messaging, trial/portal, regional LLM note, on-premises partial - Chat: demo before Using Chat; drop redundant screenshot; clarify chat history note - Actions: menu/control ID column; fix table syntax; rename API column for accuracy - Integration options: CDN or self-hosted; hosted AI vs on-premises AI early access - API quick start: remove multi-region Cloud section - Limits, models, options, JWT intro: contact link, model stability note, languages, token provider * Align TinyMCE AI live demos with full sample config; simplify example.js - index.js: match sample plugin set and toolbar; collaboration and Uploadcare options - example.js: minimal tinymceai-focused setup for local integration; placeholder Uploadcare key * chore: empty commit to trigger docs preview workflow * ci: allow manual Preview Create/Update runs via workflow_dispatch - Add pr_number input; checkout refs/pull/N/head for manual runs - Move PR env to job level so pull_request and dispatch both resolve * ci: revert manual workflow_dispatch from preview_create workflow * ci: add manual preview trigger and extra pull_request types (DOC-3399) * Update modules/ROOT/pages/tinymceai-actions-plugin.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Apply suggestions from code review Co-authored-by: Millie <milliemacdonald4@gmail.com> * Apply suggestions from code review Co-authored-by: Millie <milliemacdonald4@gmail.com> * docs: address TinyMCE AI review feedback for nav, chat, plugin, and options - Align Integration Options nav labels (Plugin Configuration, API Quick Start) - Chat: configuration before web search/reasoning; clarify custom sources and chat history note; link Conversations API to API docs - Plugin page: trial demo identity note; drop redundant tinymceai_sidebar_type in example - tinymceai_options: Quick Toolbars tip wording - Models: remove tinymceai_allowed_models from explanatory text (not in plugin Options) - Quick Actions: omit default tinymceai_sidebar_type in sample init - Remove unused jwt-setup-tinymceai partial (content covered by JWT intro and guides) * Update modules/ROOT/pages/tinymceai-models.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/pages/tinymceai-introduction.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/toolbar-button-ids/tinymceai-toolbar-buttons.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/pages/tinymceai-actions-plugin.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/pages/tinymceai-models.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * DOC-3356: Clarify Translation Review note and add cross-references. * DOC-3356: Add plugin and models xrefs on TinyMCE AI introduction. * Update modules/ROOT/partials/configuration/tinymceai_options.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * DOC-3356: Clarify tinymceai_token_provider return shape per review feedback. * DOC-3356: Expand tinymceai_chat_fetch_sources description per review. * DOC-3356: Include tinymceai_chat_fetch_source in fetch_sources example. * ci: use canonical raw.githubusercontent URL for redirects.json in preview workflow. * Apply suggestions from code review Co-authored-by: Millie <milliemacdonald4@gmail.com> Co-authored-by: Kim <45845989+kimwoodfield@users.noreply.github.com> * DOC-3356: Align tinymceai plugin examples and address review feedback - Document default Silver toolbar AI buttons vs custom toolbar strings - Rename UI Control section to Sidebars; place after toolbar and menu items - Use textarea selector consistently in setup examples * Docs: address TinyMCE AI review feedback - Clarify tinymceai_languages language field as name or label - Document AI sidebars via core ToggleSidebar; link Miscellaneous Core Commands - Rework streaming page: SSE format, eventsource-parser example, simplify errors * Docs: remove redundant intro on TinyMCE AI limits page Single Overview paragraph covers scope and rationale without repeating. * Docs: replace enforces with applies on AI limits overview * Remove unused TinyMCE AI privacy stub page Privacy content remains on the introduction page; the standalone file was not linked from navigation or other pages. * Update modules/ROOT/pages/tinymceai-models.adoc Co-authored-by: Kim <45845989+kimwoodfield@users.noreply.github.com> * Docs: clarify JWT as source of truth for allowed AI models Model permissions in the JWT define which models may be used for the plugin and API. Plugin and API options only select among allowed models; document custom Quick Actions and link to permissions. * Remove redundant tinymceai_token_provider note from models page Token endpoint response handling belongs with tinymceai_token_provider docs; the models page example stays focused on model configuration. * Clarify models API limits wording in TinyMCE AI docs Replace vague 'authoritative for the environment/deployment' phrasing with explicit language about runtime limits the service applies. * Address review feedback on TinyMCE AI streaming page Remove duplicate Event Handling Patterns section, clarify progress tracking link text, and simplify API reference to the main docs URL. * DOC-3356: Clarify JWT auth and trial demo in AI API quick start * DOC-3356: Clarify editor integration copy on AI integration options page * Update modules/ROOT/partials/configuration/tinymceai_options.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/configuration/tinymceai_options.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/configuration/tinymceai_options.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/partials/configuration/tinymceai_options.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Nest AI Assistant (legacy) under TinyMCE AI in nav * Add TinyMCE AI feature banner to premium plugins index * Fix TinyMCE AI feature banner: single passthrough preserves markup before styles Asciidoctor emitted a style-only pass block before the open block, unlike the signup banner partial. Use one passthrough with markup then style so layout matches other promo blocks. * DOC-3356: Fix css issue. * Fix docs UI: remove literal <s> from nav and 8.4.0 release notes Release-notes template placeholders like plugin<s> and improvement<s> were published as raw angle brackets. Browsers treated <s> as HTML, which broke sidebar markup site-wide. Correct 8.4.0 nav xrefs to #new-premium-plugins and #new-open-source-plugin; replace placeholder wording with final copy. * Revert premium plugins TinyMCE AI feature banner Remove admon-plugins-tinymce-ai-feature partial and include; restore TinyMCE AI as a table row and prior AI Assistant copy. * Reintroduce TinyMCE AI premium plugins feature banner Restore partial with single passthrough (markup before inline styles). Include from premium-plugins; AI Assistant (legacy) row; no duplicate TinyMCE AI table row. * Document GPT-5.4, Claude 4.6 Sonnet, and Gemini 3.1 Pro in AI models table * Document trial demo identity service for tinymceai_token_provider * Link Conversations API section to interactive OpenAPI documentation * Refine Quick Actions and Review docs; remove redundant toolbar screenshot * Reorder Review plugin screenshots to match adjacent text * Link tinymceai_reviews from Review commands NOTE * DOC-3356: Address Review plugin doc feedback on terminology and Quick Actions framing * Docs: align Quick Actions and Review framing with Review page Reframe comparison around scope and UI; remove misleading suggestions vs transformations contrast. Rename section, deduplicate Actions API paragraph with cross-reference. * Docs: link Node.js and PHP JWT guides from API quick start After keypair steps, point to full token endpoint implementations to match JWT Authentication quick setup. * Docs: add blank line before token endpoint list in JWT intro * Docs: align models table with GET /v1/models and fix examples - Order Supported Models like API items; drop gemini-3-pro (not listed) - Match GPT-5 Mini description to API; default model example uses claude-4-5-haiku * Docs: address Chat and Introduction review feedback - Chat: clarify default model ids and link to models API; list context file types - Introduction: add Next steps section with links to setup and API docs * Docs: clarify TinyMCE AI toolbar and Quickbars integration for Quick Actions Describe default versus custom toolbar behavior, link quickbars_selection_toolbar, add Quickbars example, and remove redundant toolbar guide sentence. * Docs: correct AI Chat model selection behavior in tinymceai-chat The model selector can be used at any time during a conversation; a new chat is not required to switch models. * Docs: clarify Expand control for chat modification history Describe Expand as collapsing or expanding modification history in the chat panel, not document suggestions. Move the explanation to Working with AI-generated changes. * Docs: align Quick Actions table with Review page terminology Rename the first column to Editor, shorten the column intro bullets, and clarify system actions versus Chat without repeating the REST path. * Docs: place stateless Quick Actions copy early; clarify vs Review Introduce stateless behavior and Chat handoff near the page opening; add a Quick Actions vs Review lead-in; dedupe the Actions API section and link to the stateless anchor. * Docs: drop duplicate Quick Actions vs Review cross-ref from Actions API Keep the comparison in Quick Actions and Review only; the Actions API section stays focused on REST behavior. * Docs: use default instead of predefined for TinyMCE AI actions and reviews Align Quick Actions, Review system reviews, and quickactions_menu wording with Default Actions terminology. * Docs: clarify custom Quick Actions types without preview rendering jargon Describe action vs chat items in terms of editor preview and Chat UX per review feedback. * Docs: clarify JWT flow, token endpoint, and tinymceai_token_provider in AI API quick start Address review: explain why signing stays on the server, link production steps to Writing your own token endpoint, and connect the editor and REST API to the same JWT. * Docs: reorder AI API quick start next steps to lead with models Put API Overview last as optional map; avoids sending readers back to Quick Start as the first follow-on. * Docs: fix circular streaming xrefs; point to OpenAPI for event payloads SSE Event Types and Progress now reference interactive API tags instead of feature subsections that only link back to the streaming guide. * DOC-3356: Rename TinyMCE AI Review and Actions pages for URL clarity Rename tinymceai-review-plugin and tinymceai-actions-plugin to tinymceai-review and tinymceai-actions so paths reflect features under the tinymceai plugin. Update navigation, cross-references, and partials. * Docs: update TinyMCE AI JWT trial examples and clarify token provider - Use inline no-api-key URLs and open AI chat sidebar in samples - Align toolbar order and token provider async flow with demo identity - Add comments explaining session establishment and JWT shape * Revert "ci: use canonical raw.githubusercontent URL for redirects.json in preview workflow." This reverts commit 20a1098. * Revert "ci: add manual preview trigger and extra pull_request types (DOC-3399)" This reverts commit 8121a0f. * Docs: expand TinyMCE AI 8.4.0 release notes with outcomes and trial tip - Lead with user-facing benefits; follow with Chat, Review, Actions detail - Add outcome bullets and Customer Portal trial TIP aligned with intro page * Docs: add Chat, Review, and Actions toolbar icons to 8.4.0 release notes Use the same SVG assets as the tinymceai toolbar button partials. * Update modules/ROOT/pages/8.4.0-release-notes.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/pages/8.4.0-release-notes.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> * Update modules/ROOT/pages/8.4.0-release-notes.adoc Co-authored-by: Millie <millie.macdonald@tiny.cloud> --------- Co-authored-by: Millie <millie.macdonald@tiny.cloud> Co-authored-by: Millie <milliemacdonald4@gmail.com> Co-authored-by: Kim <45845989+kimwoodfield@users.noreply.github.com>
1 parent e7e2fc5 commit 263e789

132 files changed

Lines changed: 4547 additions & 173 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

-scripts/README-llm-files.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,7 @@ The files are generated in `modules/ROOT/attachments/`:
8181

8282
**Post-build:** Files are moved to the root directory (handled in separate PR) and accessible at:
8383
- `https://www.tiny.cloud/docs/tinymce/latest/llms.txt`
84-
- `https://www.tiny.cloud/docs/tinymce/latest/llms-full.txt`
84+
- `https://www.tiny.cloud/docs/llms-full.txt`
8585

8686
## How It Works
8787

-scripts/generate-llm-files.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ const http = require('http');
1616
const sanitizeHtml = require('sanitize-html');
1717

1818
const BASE_URL = 'https://www.tiny.cloud/docs/tinymce/latest';
19+
const DOCS_ROOT_URL = 'https://www.tiny.cloud/docs';
1920
const OUTPUT_DIR = path.join(__dirname, '../modules/ROOT/attachments');
2021

2122
// Fetch sitemap from URL or file
@@ -1187,7 +1188,7 @@ function App() {
11871188
11881189
## Complete Documentation
11891190
1190-
For a complete list of all ${urls.length} documentation pages, see [llms-full.txt](${BASE_URL}/llms-full.txt).
1191+
For a complete list of all ${urls.length} documentation pages, see [llms-full.txt](${DOCS_ROOT_URL}/llms-full.txt).
11911192
11921193
`;
11931194
}

antora.yml

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ asciidoc:
1010
companyurl: https://www.tiny.cloud
1111
cdnurl: https://cdn.tiny.cloud/1/no-api-key/tinymce/8/tinymce.min.js
1212
tdcdnurl: https://cdn.tiny.cloud/1/_your_api_key_/tinydrive/8/tinydrive.min.js
13-
tinymce_live_demo_url: https://cdn.tiny.cloud/1/qagffr3pkuv17a8on1afax661irst1hbr4e6tbv888sz91jc/tinymce/8/tinymce.min.js
13+
tinymce_live_demo_url: https://cdn.tiny.cloud/1/qagffr3pkuv17a8on1afax661irst1hbr4e6tbv888sz91jc/tinymce/8-testing/tinymce.min.js
1414
tinydrive_live_demo_url: https://cdn.tiny.cloud/1/qagffr3pkuv17a8on1afax661irst1hbr4e6tbv888sz91jc/tinydrive/8/tinydrive.min.js
1515
webcomponent_url: https://cdn.jsdelivr.net/npm/@tinymce/tinymce-webcomponent/dist/tinymce-webcomponent.min.js
1616
jquery_url: https://cdn.jsdelivr.net/npm/@tinymce/tinymce-jquery@2/dist/tinymce-jquery.min.js
@@ -22,7 +22,9 @@ asciidoc:
2222
dockerimageexporttopdf: registry.containers.tiny.cloud/pdf-converter-tiny
2323
dockerimageexporttopdfwindows: registry.containers.tiny.cloud/pdf-converter-windows-tiny
2424
# document converter placeholder variables
25-
exportpdf_service_url: exportpdf_service_url placeholder
25+
exportpdf_service_url: exportpdf_service_url placeholder
26+
# TinyMCE AI demo API key
27+
tinymceai_demo_api_key: qagffr3pkuv17a8on1afax661irst1hbr4e6tbv888sz91jc
2628
# product variables
2729
productname: TinyMCE
2830
productmajorversion: 8

modules/ROOT/attachments/llms.txt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -101,5 +101,5 @@ function App() {
101101

102102
## Complete Documentation
103103

104-
For a complete list of all 395 documentation pages, see [llms-full.txt](https://www.tiny.cloud/docs/tinymce/latest/llms-full.txt).
104+
For a complete list of all 395 documentation pages, see [llms-full.txt](https://www.tiny.cloud/docs/llms-full.txt).
105105

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
// Step 1: Set up session - this should be part of the application's user management process.
2+
// Open-source plugins below are only for editing the demo HTML (lists, links, tables). TinyMCE AI options are the focus.
3+
tinymce.init({
4+
selector: 'textarea#tinymceai-actions',
5+
height: '800px',
6+
plugins: ['tinymceai', 'advlist', 'lists', 'link', 'autolink', 'table', 'wordcount'],
7+
toolbar: 'undo redo | tinymceai-chat tinymceai-review tinymceai-quickactions | styles | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link',
8+
sidebar_show: 'tinymceai-chat',
9+
tinymceai_token_provider: async () => {
10+
return fetch('/api/tinymceai-token', { credentials: 'include' })
11+
.then(resp => resp.text())
12+
.then(token => ({ token }));
13+
},
14+
tinymceai_chat_fetch_sources: () => Promise.resolve([{
15+
label: 'TinyMCE resources',
16+
sources: [
17+
{ id: 'docs', label: 'TinyMCE Documentation', type: 'web-resource' },
18+
{ id: 'blog', label: 'Tiny Blog', type: 'web-resource' },
19+
{ id: 'survey-2023', label: 'State of rich text editing 2023', type: 'web-resource' },
20+
]
21+
}]),
22+
tinymceai_chat_fetch_source: (id) => {
23+
const urls = {
24+
'docs': 'https://www.tiny.cloud/docs/tinymce/latest/',
25+
'blog': 'https://www.tiny.cloud/blog/',
26+
'survey-2023': 'https://www.tiny.cloud/developer-survey-results-2023/',
27+
};
28+
return Promise.resolve({ type: 'web-resource', url: urls[id] });
29+
},
30+
tinymceai_quickactions_custom: [
31+
{
32+
type: 'chat',
33+
title: 'Challenge',
34+
prompt: 'Challenge statements, verify facts and identify assumptions'
35+
}
36+
],
37+
tinymceai_languages: [
38+
{ title: 'English', language: 'english' },
39+
{ title: 'Chinese (Simplified)', language: 'chinese' },
40+
{ title: 'Spanish', language: 'spanish' },
41+
{ title: 'German', language: 'german' },
42+
{ title: 'Japanese', language: 'japanese' },
43+
{ title: 'Portuguese', language: 'portuguese' },
44+
{ title: 'Swedish', language: 'swedish' },
45+
{ title: 'Korean', language: 'korean' },
46+
{ title: 'Hindi (Devanagari)', language: 'hindi devanagari' },
47+
{ title: 'Italian', language: 'italian' },
48+
{ title: 'Klingon', language: 'klingon' },
49+
{ title: 'Dothraki', language: 'dothraki' },
50+
]
51+
});
Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
<textarea id="tinymceai-actions">
2+
<h1>The Future of Content Creation: Integrating GenAI into Modern Workflows</h1>
3+
<p>The landscape of digital content creation is undergoing a seismic shift. For years, the process of writing, editing, and publishing remained largely manual, requiring significant cognitive load for every draft. However, the emergence of Generative AI (GenAI) has introduced a new paradigm. By embedding intelligence directly into the tools where writing happens, organizations can unlock unprecedented levels of productivity and creativity.</p>
4+
<figure class="image"><img style="width: 566px; aspect-ratio: 1536 / 1024; display: block; margin-left: auto; margin-right: auto;" src="https://tiny.ucarecdn.com/c273f5d9-8931-4f66-86a4-347a6137ca88/-/preview/" sizes="(min-width: 1536px) 1536px, 100vw" srcset="https://tiny.ucarecdn.com/c273f5d9-8931-4f66-86a4-347a6137ca88/-/resize/100x/ 100w,https://tiny.ucarecdn.com/c273f5d9-8931-4f66-86a4-347a6137ca88/-/resize/200x/ 200w,https://tiny.ucarecdn.com/c273f5d9-8931-4f66-86a4-347a6137ca88/-/resize/300x/ 300w,https://tiny.ucarecdn.com/c273f5d9-8931-4f66-86a4-347a6137ca88/-/resize/500x/ 500w,https://tiny.ucarecdn.com/c273f5d9-8931-4f66-86a4-347a6137ca88/-/resize/750x/ 750w,https://tiny.ucarecdn.com/c273f5d9-8931-4f66-86a4-347a6137ca88/-/resize/1000x/ 1000w,https://tiny.ucarecdn.com/c273f5d9-8931-4f66-86a4-347a6137ca88/-/resize/1250x/ 1250w,https://tiny.ucarecdn.com/c273f5d9-8931-4f66-86a4-347a6137ca88/-/resize/1500x/ 1500w,https://tiny.ucarecdn.com/c273f5d9-8931-4f66-86a4-347a6137ca88/-/preview/ 1536w" alt="Retro pop art illustration in red and blue halftone style showing a friendly robot collaborating with three people using laptops and tablets, symbolizing AI-assisted content creation and teamwork." height="357">
5+
<figcaption>By embedding intelligence directly into the tools where writing happens, organizations unlock unprecedented levels of productivity and creativity.</figcaption>
6+
</figure>
7+
<h2>The Shift from External Tools to Native Integration</h2>
8+
<p>Many early adopters of AI technology rely on external chat interfaces. While powerful, this "copy-paste" workflow introduces friction and disrupts the creative flow. Native integration&mdash;where the AI exists within the text editor itself&mdash;allows creators to remain focused. Instead of switching tabs to generate a summary or check facts, the AI acts as a collaborative partner that understands the context of the current document.</p>
9+
<h3>Key Benefits of Integrated AI</h3>
10+
<ul>
11+
<li><strong>Contextual Awareness:</strong> AI can analyze existing text to suggest relevant follow-up points or maintain a consistent brand voice.</li>
12+
<li><strong>Reduced Cognitive Load:</strong> By automating repetitive tasks like formatting and basic proofreading, writers can focus on high-level strategy and storytelling.</li>
13+
<li><strong>Streamlined Collaboration:</strong> Integrated tools allow teams to brainstorm and refine ideas within a single shared environment, accelerating the approval process.</li>
14+
<li><strong>Enhanced Accuracy:</strong> When connected to internal knowledge bases, GenAI can provide fact-checking capabilities that generic models lack.</li>
15+
</ul>
16+
<h2>Evaluating Workflow Improvements</h2>
17+
<p>To understand the impact of GenAI integration, it is helpful to compare traditional workflows against AI-enhanced processes. The following table highlights common content tasks and how native AI transforms the output and efficiency for different stakeholders.</p>
18+
<table style="width: 100%; border-collapse: collapse; margin-top: 20px; margin-bottom: 20px; border: 1px solid rgb(206, 212, 217);" border="1">
19+
<thead>
20+
<tr>
21+
<th style="border-color: #ced4d9; background-color: #ecf0f1; width: 26.6364%;">Workflow Task</th>
22+
<th style="border-color: #ced4d9; background-color: #ecf0f1; width: 35.8714%;">Traditional Method</th>
23+
<th style="border-color: #ced4d9; background-color: #ecf0f1; width: 37.4922%;">GenAI-Enhanced Method</th>
24+
</tr>
25+
</thead>
26+
<tbody>
27+
<tr>
28+
<td style="border-color: #ced4d9; width: 26.6364%;"><strong>Drafting</strong></td>
29+
<td style="border-color: #ced4d9; width: 35.8714%;">Starting from a blank page.</td>
30+
<td style="border-color: #ced4d9; width: 37.4922%;">AI-generated outlines and initial drafts.</td>
31+
</tr>
32+
<tr>
33+
<td style="border-color: #ced4d9; width: 26.6364%;"><strong>Research</strong></td>
34+
<td style="border-color: #ced4d9; width: 35.8714%;">Manual searching across multiple tabs.</td>
35+
<td style="border-color: #ced4d9; width: 37.4922%;">Instant retrieval of internal/external data.</td>
36+
</tr>
37+
<tr>
38+
<td style="border-color: #ced4d9; width: 26.6364%;"><strong>Tone Adjustment</strong></td>
39+
<td style="border-color: #ced4d9; width: 35.8714%;">Manual rewriting for different audiences.</td>
40+
<td style="border-color: #ced4d9; width: 37.4922%;">One-click conversion (e.g., Casual to Formal).</td>
41+
</tr>
42+
<tr>
43+
<td style="border-color: #ced4d9; width: 26.6364%;"><strong>Summarization</strong></td>
44+
<td style="border-color: #ced4d9; width: 35.8714%;">Reading full text and manual condensing.</td>
45+
<td style="border-color: #ced4d9; width: 37.4922%;">Automated key takeaway generation.</td>
46+
</tr>
47+
<tr>
48+
<td style="border-color: #ced4d9; width: 26.6364%;"><strong>Localization</strong></td>
49+
<td style="border-color: #ced4d9; width: 35.8714%;">External translation services required.</td>
50+
<td style="border-color: #ced4d9; width: 37.4922%;">In-editor multilingual support and translation.</td>
51+
</tr>
52+
</tbody>
53+
</table>
54+
<h2>Overcoming Adoption Challenges</h2>
55+
<p>While the advantages are clear, implementing GenAI requires a strategic approach. Concerns regarding data privacy, output quality, and the "human touch" are common. <em>To address these, organizations should prioritize tools that offer "human-in-the-loop" functionality</em>. AI should be viewed as an assistant&mdash;a co-pilot that offers suggestions while leaving final editorial control in the hands of the writer.</p>
56+
<p>Furthermore, technical teams must focus on the "integrator" experience. Providing developers with straightforward APIs and pre-built UI components ensures that these advanced features can be deployed quickly <strong>without the risk of building complex AI infrastructure from scratch</strong>. As we look toward the future, the goal is simple: technology that fades into the background, empowering creators to do their best work with less friction.</p>
57+
</textarea>
Lines changed: 112 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,112 @@
1+
// 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.
2+
const apiKey = '{{tinymceai_demo_api_key}}';
3+
const isLoggedIn = fetch(`https://demo.api.tiny.cloud/1/${apiKey}/auth/random`, { method: "POST", credentials: "include" });
4+
5+
const mentions_fetch = async (query, success) => {
6+
const searchPhrase = query.term.toLowerCase();
7+
await fetch(`https://demouserdirectory.tiny.cloud/v1/users?q=${encodeURIComponent(searchPhrase)}`)
8+
.then((response) => response.json())
9+
.then((users) => success(users.data.map((userInfo) => ({
10+
id: userInfo.id,
11+
name: userInfo.name,
12+
image: userInfo.avatar,
13+
description: userInfo.custom.role
14+
}))))
15+
.catch(() => {});
16+
};
17+
18+
const fetch_users = (userIds) => Promise.all(userIds.map((userId) => fetch(`https://demouserdirectory.tiny.cloud/v1/users/${userId}`).then((response) => response.json()).catch(() => ({ id: userId }))));
19+
20+
tinymce.init({
21+
selector: 'textarea#tinymceai-actions',
22+
height: '800px',
23+
plugins: [
24+
'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',
25+
'quickbars', 'tinymceai', 'tinycomments', 'mentions', 'revisionhistory', 'suggestededits', 'uploadcare'
26+
],
27+
toolbar: 'undo redo | tinymceai-chat tinymceai-review tinymceai-quickactions spellchecker | styles | bold italic underline forecolor backcolor casechange | link uploadcare table addcomment | align bullist numlist checklist removeformat | code fullscreen help',
28+
quickbars_selection_toolbar: 'tinymceai-quickactions addcomment',
29+
sidebar_show: 'tinymceai-chat',
30+
toolbar_mode: 'sliding',
31+
visual: false,
32+
images_file_types: 'jpeg,jpg,jpe,jfi,jif,jfif,png,gif,bmp,webp,svg',
33+
user_id: 'james-wilson',
34+
spellchecker_active: true,
35+
spellchecker_dialog: true,
36+
uploadcare_public_key: '630992ad50fe2291c406',
37+
uploadcare_store_type: 'temporary',
38+
advcode_inline: true,
39+
tinycomments_mode: 'embedded',
40+
suggestededits_content: 'html',
41+
mentions_item_type: 'profile',
42+
mentions_fetch,
43+
fetch_users,
44+
revisionhistory_fetch: () => {
45+
const textarea = document.querySelector('textarea#tinymceai-actions');
46+
const initialContent = textarea ? textarea.value : '';
47+
const revisions = [
48+
{
49+
revisionId: '1',
50+
createdAt: new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate() - 1, 14, 32, 0).getTime(),
51+
author: {
52+
id: 'jade-scott',
53+
name: 'Jade Scott',
54+
avatar: 'https://sneak-preview.tiny.cloud/demouserdirectory/images/employee_jade-scott_128_515dc6a1.jpg',
55+
},
56+
content: initialContent
57+
},
58+
{
59+
revisionId: '0',
60+
createdAt: new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate() - 1, 14, 32, 0).getTime(),
61+
author: {
62+
id: 'jade-scott',
63+
name: 'Jade Scott',
64+
avatar: 'https://sneak-preview.tiny.cloud/demouserdirectory/images/employee_jade-scott_128_515dc6a1.jpg',
65+
},
66+
content: ''
67+
}
68+
];
69+
return Promise.resolve(revisions.sort((a, b) => (new Date(a.createdAt) < new Date(b.createdAt) ? -1 : 1)));
70+
},
71+
revisionhistory_display_author: true,
72+
tinymceai_token_provider: async () => {
73+
return isLoggedIn.then(() =>
74+
fetch(`https://demo.api.tiny.cloud/1/${apiKey}/jwt/tinymceai`, { credentials: "include" })
75+
.then(resp => resp.text())
76+
.then(token => ({ token }))
77+
);
78+
},
79+
tinymceai_chat_fetch_sources: () => Promise.resolve([{
80+
label: 'TinyMCE resources',
81+
sources: [
82+
{ id: 'docs', label: 'TinyMCE Documentation', type: 'web-resource' },
83+
{ id: 'blog', label: 'Tiny Blog', type: 'web-resource' },
84+
{ id: 'survey-2023', label: 'State of rich text editing 2023', type: 'web-resource' },
85+
]
86+
}]),
87+
tinymceai_chat_fetch_source: (id) => {
88+
const urls = {
89+
'docs': 'https://www.tiny.cloud/docs/tinymce/latest/',
90+
'blog': 'https://www.tiny.cloud/blog/',
91+
'survey-2023': 'https://www.tiny.cloud/developer-survey-results-2023/',
92+
};
93+
return Promise.resolve({ type: 'web-resource', url: urls[id] });
94+
},
95+
tinymceai_quickactions_custom: [
96+
{ type: 'chat', title: 'Challenge', prompt: 'Challenge statements, verify facts and identify assumptions' }
97+
],
98+
tinymceai_languages: [
99+
{ title: 'English', language: 'english' },
100+
{ title: 'Chinese (Simplified)', language: 'chinese' },
101+
{ title: 'Spanish', language: 'spanish' },
102+
{ title: 'German', language: 'german' },
103+
{ title: 'Japanese', language: 'japanese' },
104+
{ title: 'Portuguese', language: 'portuguese' },
105+
{ title: 'Swedish', language: 'swedish' },
106+
{ title: 'Korean', language: 'korean' },
107+
{ title: 'Hindi (Devanagari)', language: 'hindi devanagari' },
108+
{ title: 'Italian', language: 'italian' },
109+
{ title: 'Klingon', language: 'klingon' },
110+
{ title: 'Dothraki', language: 'dothraki' },
111+
]
112+
});
Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
// Step 1: Set up session - this should be part of the application's user management process.
2+
// Open-source plugins below are only for editing the demo HTML (lists, links, tables). TinyMCE AI options are the focus.
3+
tinymce.init({
4+
selector: 'textarea#tinymceai-review',
5+
height: '800px',
6+
plugins: ['tinymceai', 'advlist', 'lists', 'link', 'autolink', 'table', 'wordcount'],
7+
toolbar: 'undo redo | tinymceai-chat ai-quickactions-translate tinymceai-review | styles | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link',
8+
sidebar_show: 'tinymceai-review',
9+
tinymceai_token_provider: async () => {
10+
return fetch('/api/tinymceai-token', { credentials: 'include' })
11+
.then(resp => resp.text())
12+
.then(token => ({ token }));
13+
},
14+
tinymceai_chat_fetch_sources: () => Promise.resolve([{
15+
label: 'TinyMCE resources',
16+
sources: [
17+
{ id: 'docs', label: 'TinyMCE Documentation', type: 'web-resource' },
18+
{ id: 'blog', label: 'Tiny Blog', type: 'web-resource' },
19+
{ id: 'survey-2023', label: 'State of rich text editing 2023', type: 'web-resource' },
20+
]
21+
}]),
22+
tinymceai_chat_fetch_source: (id) => {
23+
const urls = {
24+
'docs': 'https://www.tiny.cloud/docs/tinymce/latest/',
25+
'blog': 'https://www.tiny.cloud/blog/',
26+
'survey-2023': 'https://www.tiny.cloud/developer-survey-results-2023/',
27+
};
28+
return Promise.resolve({ type: 'web-resource', url: urls[id] });
29+
},
30+
tinymceai_quickactions_custom: [
31+
{
32+
type: 'chat',
33+
title: 'Challenge',
34+
prompt: 'Challenge statements, verify facts and identify assumptions'
35+
}
36+
],
37+
tinymceai_languages: [
38+
{ title: 'English', language: 'english' },
39+
{ title: 'Chinese (Simplified)', language: 'chinese' },
40+
{ title: 'Spanish', language: 'spanish' },
41+
{ title: 'German', language: 'german' },
42+
{ title: 'Japanese', language: 'japanese' },
43+
{ title: 'Portuguese', language: 'portuguese' },
44+
{ title: 'Swedish', language: 'swedish' },
45+
{ title: 'Korean', language: 'korean' },
46+
{ title: 'Hindi (Devanagari)', language: 'hindi devanagari' },
47+
{ title: 'Italian', language: 'italian' },
48+
{ title: 'Klingon', language: 'klingon' },
49+
{ title: 'Dothraki', language: 'dothraki' },
50+
]
51+
});

0 commit comments

Comments
 (0)