Smart.Editor: Powerful JavaScript WYSIWYG Editor for Angular, React, Vue & Blazor | HTML Elements

Smart.Editor: Powerful & Intuitive JavaScript WYSIWYG Editor Component

Enterprise-ready WYSIWYG Editor

Feature-complete Content Management

Powered by jQWidgets

Smart.Editor

Angular Editor

React Editor

Javascript Editor

Blazor Editor

Vue Editor

The Most Powerful WYSIWYG Editor Component


Toolbar

The Smart UI React Editor features a customizable toolbar with actions to insert, delete, or style content based on text selection, enhanced with AI-driven formatting suggestions for improved productivity.


Context Menu

The built-in context menu activates on right-click, offering customizable options based on the target element. Learn more here.


Context Menu in React Editor

Mobile Optimized

Fully responsive, the React Editor delivers a seamless experience across desktops, tablets, and mobile devices, with AI-enhanced usability.

Security

The 'sanitized' property ensures protection against XSS vulnerabilities by preventing scripts and malicious content within the editor.

Paste Options

  • Prompt: Displays a dialog for selecting paste format.
  • Plain Text: Pastes content without formatting.
  • Keep Format: Retains original formatting.
  • Clean Format: Removes all formatting for clean text.


Paste Options in React Editor


Find and Replace Dialog

Find & Replace

A dialog-based Find and Replace tool allows users to search and replace text efficiently, with AI-driven match suggestions displayed in a list box.


Search Bar

A dedicated search bar enables quick text searches within the editor’s content, enhanced by AI for faster results.


Search Bar in React Editor

Markdown Editor

Switch to Markdown mode to write and preview Markdown content, with AI-assisted formatting and export options for MD files via the exportData method.

Keyboard Shortcuts

Enhance accessibility with robust keyboard navigation. Supported shortcuts include:

  • Insert Link: Ctrl + K
  • Insert Image: Ctrl + Shift + I
  • Insert Table: Ctrl + Shift + E
  • Undo: Ctrl + Z
  • Redo: Ctrl + Y
  • Copy: Ctrl + C
  • Cut: Ctrl + X
  • Paste: Ctrl + V
  • Bold: Ctrl + B
  • Italic: Ctrl + I
  • Underline: Ctrl + U
  • Strikethrough: Ctrl + Shift + S
  • Uppercase: Ctrl + Shift + U
  • Lowercase: Ctrl + Shift + L
  • Superscript: Ctrl + Shift + =
  • Subscript: Ctrl + =
  • Indent: Ctrl + ]
  • Outdent: Ctrl + [
  • Source Code/Preview Mode: Ctrl + Shift + H
  • Full Screen Mode: Ctrl + Shift + F
  • Justify Center: Ctrl + E
  • Justify Full: Ctrl + J
  • Justify Left: Ctrl + L
  • Justify Right: Ctrl + R
  • Clear Format: Ctrl + Shift + R
  • Ordered List: Ctrl + Shift + O
  • Unordered List: Ctrl + Alt + O

Dialogs

Built-in dialogs for inserting and editing hyperlinks, tables, images, and videos provide a seamless content management experience, with AI suggestions for link and media insertion.



Single-line Ribbon in React Editor

Single-line Ribbon

The simplified single-line ribbon mode offers a compact toolbar for efficient web app integration, optimized with AI-driven layout suggestions.


Tables

Comprehensive table editing tools include:

  • Table Dialog for easy creation
  • Add rows above/below
  • Add columns left/right
  • Delete rows/columns
  • Table header and alternate row styling
  • Table resizing and alignment
  • Dashed borders and colored headers


Table Editing in React Editor

More Features

Video Support

Embed videos from local storage or YouTube, alongside images, tables, and hyperlinks for rich content creation, with AI-assisted media embedding.

Iframe Mode

Isolate the editor’s content in an iframe to prevent style and script leaks, ensuring clean and secure content management.

Themes

Choose from Material UI, Bootstrap, and custom themes with light and dark modes for a tailored experience, optimized with AI-driven theme suggestions.

Globalization

Format numbers, dates, and currencies to suit various locales, enhancing global usability with AI-driven localization.

Localization

Customize every string using 'locale' and 'messages' properties for a localized user experience, enhanced by AI translation suggestions.

Right-to-Left Support

Optimized rendering for RTL languages, improving UX for Arabic, Hebrew, and more, with AI-optimized layout adjustments.

The smarter choice for your JS WYSIWYG Editor

High performance and scalability

Harness large documents with Smart.Editor's optimized rendering and virtual scrolling, delivering lightning-fast performance and seamless navigation—even for extensive content, without compromising responsiveness.

Advanced customization and flexibility

Tailor every aspect to your vision with Smart.Editor's flexible content templates, custom toolbars, and robust API, enabling effortless integration across Angular, React, Vue, and Blazor for bespoke, high-impact content editing solutions.

Safe and affordable licensing

Flexible, domain-based licensing models focused on your applications—not per-user fees—maximize value and ROI, backed by transparent pricing with zero surprise costs for seamless deployment and long-term budgeting.

Extensive documentation and committed support

Dive into comprehensive, example-rich docs that speed up implementation, paired with dedicated expert support and a thriving developer community to resolve issues swiftly and keep your projects on track.