Editora - Enterprise Plugins

Overview

Enterprise plugins are available at @editora/plugins/enterprise for React and by plugin IDs in Web Components. Full, lite, and enterprise plugin paths are all free and customizable.

React Setup Pattern

import { EditoraEditor } from "@editora/react";
import {
  MentionPlugin,
  TrackChangesPlugin,
  VersionDiffPlugin
} from "@editora/plugins/enterprise";

const plugins = [
  MentionPlugin(),
  TrackChangesPlugin(),
  VersionDiffPlugin()
];

Web Component Setup Pattern

<editora-editor
  id="enterprise-editor"
  plugins="mention trackChanges version-diff"
  toolbar-items="mention | trackChanges versionDiff"
></editora-editor>

<script type="module">
const editor = document.getElementById("enterprise-editor");
await editor.setConfig({
  pluginConfig: {
    mention: { minChars: 1, maxSuggestions: 8 },
    trackChanges: { author: "QA Reviewer" },
    "version-diff": { mode: "word" }
  }
});
</script>

Detailed Plugin Examples

Mention - contextual @mentions with API/local suggestions

MentionPlugin({
  triggerChars: ["@"],
  minChars: 1,
  maxSuggestions: 8,
  items: [
    { id: "u-1", label: "Ajay Kumar", meta: "Product Owner" },
    { id: "u-2", label: "Nina Chen", meta: "Translator" }
  ]
});

<editora-editor id="mention-demo" plugins="mention"></editora-editor>
<script type="module">
await document.getElementById("mention-demo").setConfig({
  pluginConfig: { mention: { triggerChars: ["@"], minChars: 1, maxSuggestions: 8 } }
});
</script>

Track Changes - reviewer-author diffs and accept/reject workflow

TrackChangesPlugin({
  author: "Legal Reviewer",
  enabledByDefault: true,
  includeTimestamp: true
});

<editora-editor id="track-demo" plugins="trackChanges"></editora-editor>
<script type="module">
await document.getElementById("track-demo").setConfig({
  pluginConfig: {
    trackChanges: { author: "Legal Reviewer", enabledByDefault: true, includeTimestamp: true }
  }
});
</script>

Version Diff - compare baseline vs current draft

VersionDiffPlugin({
  mode: "word",
  ignoreWhitespace: true,
  maxTokens: 20000
});

<editora-editor id="diff-demo" plugins="version-diff"></editora-editor>
<script type="module">
await document.getElementById("diff-demo").setConfig({
  pluginConfig: { "version-diff": { mode: "word", ignoreWhitespace: true, maxTokens: 20000 } }
});
</script>

Conditional Content - audience/locale-driven blocks

ConditionalContentPlugin({
  defaultCondition: "country === 'US'",
  currentAudience: ["enterprise"],
  currentLocale: ["en-US"],
  enableElseByDefault: true
});

<editora-editor id="conditional-demo" plugins="conditional-content"></editora-editor>
<script type="module">
await document.getElementById("conditional-demo").setConfig({
  pluginConfig: {
    "conditional-content": {
      defaultCondition: "country === 'US'",
      currentAudience: ["enterprise"],
      currentLocale: ["en-US"],
      enableElseByDefault: true
    }
  }
});
</script>

Data Binding - runtime token resolution from data sources

DataBindingPlugin({
  data: {
    customer: { name: "Acme Corp", tier: "Gold" },
    invoice: { total: 12500.55 }
  },
  defaultFormat: "text",
  defaultFallback: "N/A"
});

<editora-editor id="binding-demo" plugins="data-binding"></editora-editor>
<script type="module">
await document.getElementById("binding-demo").setConfig({
  pluginConfig: {
    "data-binding": {
      data: {
        customer: { name: "Acme Corp", tier: "Gold" },
        invoice: { total: 12500.55 }
      },
      defaultFormat: "text",
      defaultFallback: "N/A"
    }
  }
});
</script>

Content Rules - policy linting and editorial quality gates

ContentRulesPlugin({
  bannedWords: ["obviously", "simply"],
  requiredHeadings: ["Overview", "Risks"],
  maxSentenceWords: 25,
  enableRealtime: true
});

<editora-editor id="rules-demo" plugins="content-rules"></editora-editor>
<script type="module">
await document.getElementById("rules-demo").setConfig({
  pluginConfig: {
    "content-rules": {
      bannedWords: ["obviously", "simply"],
      requiredHeadings: ["Overview", "Risks"],
      maxSentenceWords: 25,
      enableRealtime: true
    }
  }
});
</script>

Citations - legal/academic citation and bibliography support

CitationsPlugin({
  defaultStyle: "apa",
  enableFootnoteSync: true,
  maxRecentCitations: 15
});

<editora-editor id="citations-demo" plugins="citations"></editora-editor>
<script type="module">
await document.getElementById("citations-demo").setConfig({
  pluginConfig: {
    citations: { defaultStyle: "apa", enableFootnoteSync: true, maxRecentCitations: 15 }
  }
});
</script>

Approval Workflow - draft/review/approved lifecycle

ApprovalWorkflowPlugin({
  defaultStatus: "draft",
  lockOnApproval: true,
  requireCommentOnApprove: true,
  defaultActor: "Ops Lead"
});

<editora-editor id="approval-demo" plugins="approval-workflow"></editora-editor>
<script type="module">
await document.getElementById("approval-demo").setConfig({
  pluginConfig: {
    "approval-workflow": {
      defaultStatus: "draft",
      lockOnApproval: true,
      requireCommentOnApprove: true,
      defaultActor: "Ops Lead"
    }
  }
});
</script>

PII Redaction - scan and redact sensitive information

PIIRedactionPlugin({
  enableRealtime: true,
  redactionMode: "mask",
  maskChar: "•",
  maxFindings: 200,
  detectors: { email: true, phone: true, jwt: true, "api-key": true }
});

<editora-editor id="pii-demo" plugins="pii-redaction"></editora-editor>
<script type="module">
await document.getElementById("pii-demo").setConfig({
  pluginConfig: {
    "pii-redaction": {
      enableRealtime: true,
      redactionMode: "mask",
      maskChar: "•",
      maxFindings: 200,
      detectors: { email: true, phone: true, jwt: true, "api-key": true }
    }
  }
});
</script>

Smart Paste - source-aware cleanup for Word/Docs/HTML

SmartPastePlugin({
  enabled: true,
  defaultProfile: "balanced",
  normalizeWhitespace: false,
  profileOptions: {
    fidelity: { keepStyles: true, preserveTables: true },
    plain: { keepStyles: false, keepClasses: false }
  }
});

<editora-editor id="paste-demo" plugins="smart-paste"></editora-editor>
<script type="module">
await document.getElementById("paste-demo").setConfig({
  pluginConfig: {
    "smart-paste": {
      enabled: true,
      defaultProfile: "balanced",
      normalizeWhitespace: false,
      profileOptions: {
        fidelity: { keepStyles: true, preserveTables: true },
        plain: { keepStyles: false, keepClasses: false }
      }
    }
  }
});
</script>

Blocks Library - reusable content block insertion

BlocksLibraryPlugin({
  maxResults: 50,
  maxRecentBlocks: 10,
  blocks: [
    { id: "hero", label: "Hero Banner", category: "Marketing", html: "<h2>Launch</h2><p>Campaign copy</p>" },
    { id: "cta", label: "CTA", category: "Marketing", html: "<p><a href='#'>Get started</a></p>" }
  ]
});

<editora-editor id="blocks-demo" plugins="blocks-library"></editora-editor>
<script type="module">
await document.getElementById("blocks-demo").setConfig({
  pluginConfig: {
    "blocks-library": {
      maxResults: 50,
      maxRecentBlocks: 10,
      blocks: [
        { id: "hero", label: "Hero Banner", category: "Marketing", html: "<h2>Launch</h2><p>Campaign copy</p>" }
      ]
    }
  }
});
</script>

Document Schema - enforce document section structure

DocSchemaPlugin({
  enableRealtime: true,
  defaultSchemaId: "release-notes",
  schemas: [
    {
      id: "release-notes",
      label: "Release Notes",
      strictOrder: true,
      sections: [
        { id: "summary", title: "Summary", minOccurrences: 1, maxOccurrences: 1 },
        { id: "impacts", title: "Customer Impact", minOccurrences: 1, maxOccurrences: 1 }
      ]
    }
  ]
});

<editora-editor id="schema-demo" plugins="doc-schema"></editora-editor>
<script type="module">
await document.getElementById("schema-demo").setConfig({
  pluginConfig: {
    "doc-schema": {
      enableRealtime: true,
      defaultSchemaId: "release-notes",
      schemas: [
        {
          id: "release-notes",
          label: "Release Notes",
          strictOrder: true,
          sections: [
            { id: "summary", title: "Summary", minOccurrences: 1, maxOccurrences: 1 },
            { id: "impacts", title: "Customer Impact", minOccurrences: 1, maxOccurrences: 1 }
          ]
        }
      ]
    }
  }
});
</script>

Translation Workflow - source capture, segment locks, locale QA

TranslationWorkflowPlugin({
  sourceLocale: "en-US",
  targetLocale: "fr-FR",
  enableRealtime: true,
  segmentSelector: "p, li, td",
  localeRules: [
    { locale: "fr-FR", minLengthRatio: 0.7, maxLengthRatio: 1.5, preserveTokens: true }
  ]
});

<editora-editor id="translation-demo" plugins="translation-workflow"></editora-editor>
<script type="module">
await document.getElementById("translation-demo").setConfig({
  pluginConfig: {
    "translation-workflow": {
      sourceLocale: "en-US",
      targetLocale: "fr-FR",
      enableRealtime: true,
      segmentSelector: "p, li, td",
      localeRules: [
        { locale: "fr-FR", minLengthRatio: 0.7, maxLengthRatio: 1.5, preserveTokens: true }
      ]
    }
  }
});
</script>

Slash Commands - command palette from / trigger

SlashCommandsPlugin({
  triggerChar: "/",
  minChars: 0,
  includeDefaultItems: true,
  items: [
    { id: "insert-warning", label: "Warning Box", insertHTML: "<blockquote>⚠ Review required</blockquote>" }
  ]
});

<editora-editor id="slash-demo" plugins="slash-commands"></editora-editor>
<script type="module">
await document.getElementById("slash-demo").setConfig({
  pluginConfig: {
    "slash-commands": {
      triggerChar: "/",
      minChars: 0,
      includeDefaultItems: true,
      items: [
        { id: "insert-warning", label: "Warning Box", insertHTML: "<blockquote>⚠ Review required</blockquote>" }
      ]
    }
  }
});
</script>

Spell Check - in-editor spelling diagnostics

SpellCheckPlugin();

<editora-editor
  id="spell-demo"
  plugins="spellCheck"
  spellcheck='{"enabled":true,"provider":"browser"}'
></editora-editor>

A11y Checker - content accessibility checks

A11yCheckerPlugin();

<editora-editor
  id="a11y-demo"
  plugins="a11yChecker"
  accessibility='{"enableARIA":true,"keyboardNavigation":true,"checker":true}'
></editora-editor>

Comments - inline review comments and discussion threads

CommentsPlugin();

<editora-editor id="comments-demo" plugins="comments"></editora-editor>

Merge Tag - CRM/transactional personalization tokens

MergeTagPlugin({
  categories: [
    {
      id: "CUSTOMER",
      name: "Customer",
      tags: [
        { key: "first_name", label: "First Name", value: "{{customer.first_name}}", preview: "Ava" },
        { key: "email", label: "Email", value: "{{customer.email}}", preview: "ava@acme.com" }
      ]
    }
  ],
  defaultCategory: "CUSTOMER",
  tokenTemplate: "{value}"
});

<editora-editor id="mergetag-demo" plugins="mergeTag"></editora-editor>
<script type="module">
await document.getElementById("mergetag-demo").setConfig({
  pluginConfig: {
    mergeTag: {
      categories: [
        {
          id: "CUSTOMER",
          name: "Customer",
          tags: [
            { key: "first_name", label: "First Name", value: "{{customer.first_name}}" }
          ]
        }
      ],
      defaultCategory: "CUSTOMER"
    }
  }
});
</script>

Template - curated starter documents

import { TemplatePlugin, addCustomTemplate } from "@editora/plugins/enterprise";

addCustomTemplate({
  id: "incident-postmortem",
  name: "Incident Postmortem",
  category: "Operations",
  description: "Root-cause and corrective action structure",
  html: "<h1>Incident Summary</h1><p>Impact...</p>"
});

TemplatePlugin();

<editora-editor id="template-demo" plugins="template"></editora-editor>
<!-- Register templates before editor mount in host app bootstrap code -->

Media Manager - managed uploads and media library

import { MediaManagerPlugin, setMediaManagerConfig } from "@editora/plugins/enterprise";

setMediaManagerConfig({
  apiUrl: "https://api.acme.com",
  apiEndpoints: {
    upload: "/media/upload",
    library: "/media/library",
    delete: "/media/library"
  },
  maxFileSize: 25 * 1024 * 1024,
  allowedTypes: ["image/jpeg", "image/png", "video/mp4"]
});

MediaManagerPlugin();

<editora-editor id="media-demo" plugins="image"></editora-editor>
<!-- "image" plugin id maps to Media Manager in Web Components -->

Document Manager - export workflows (Word and fallback)

import { DocumentManagerPlugin, setDocumentManagerConfig } from "@editora/plugins/enterprise";

setDocumentManagerConfig({
  apiUrl: "https://api.acme.com",
  apiEndpoints: { exportWord: "/documents/export-word" },
  useClientSideFallback: true
});

DocumentManagerPlugin();

<editora-editor id="document-demo" plugins="document-manager"></editora-editor>

← Back to Features

🏢 Enterprise Plugins

Overview

React Setup Pattern

Web Component Setup Pattern

Detailed Plugin Examples