API reference

Every typed export, in one place.

The package exposes a small, typed surface over the full RichTextEditor runtime: a create function, a class facade, loader helpers, and the option / instance / event types. Signatures below are taken straight from the shipped declarations.

Getting started Framework guides

createRichTextEditor

The primary entry point.

Attaches to a container and resolves to a typed instance. Asset options fall back to config.url_base and then the default base path, so the simplest call is just createRichTextEditor(host).

function createRichTextEditor(
  container: EditorContainer,
  config?: RichTextEditorOptions,
  assetOptions?: RichTextEditorAssetOptions,
): Promise<RichTextEditorInstance>;

// EditorContainer = string | HTMLElement | HTMLInputElement | HTMLTextAreaElement

TypeScriptRichTextEditor

An object facade over the instance.

Prefer methods and an html property? The class wraps the same instance and adds an on that returns an unsubscribe function.

class TypeScriptRichTextEditor {
  static create(container, config?, assetOptions?): Promise<TypeScriptRichTextEditor>;
  readonly instance: RichTextEditorInstance;   // the underlying editor
  html: string;                                 // getter / setter over the HTML
  focus(): void;
  exec(command: string, value?: unknown): unknown;
  on(name, handler): () => void;                // returns an unsubscribe fn
  destroy(): void;
}

Loader helpers

Drop to the runtime directly.

createRichTextEditor uses these under the hood. Call them yourself to preload assets or reach the raw constructor. loadRichTextEditorAssets injects the theme CSS, rte.js, all_plugins.js (unless disabled), and any language file, then returns window.RichTextEditor.

// Lower-level helpers, also exported from the package root:
function loadRichTextEditorAssets(
  options?: RichTextEditorAssetOptions,
): Promise<RichTextEditorConstructor>;          // injects css + rte.js + plugins + lang

function getRichTextEditorConstructor(): RichTextEditorConstructor | null;
function getDefaultRichTextEditorBasePath(): string;
function normalizeRichTextEditorBasePath(basePath?: string): string;

RichTextEditorInstance

What you get back.

The core methods are typed; the index signature means the entire runtime API remains reachable even where it isn't explicitly declared.

interface RichTextEditorInstance {
  version?: string;
  focus(): void;
  getHTML(): string;
  getHTMLCode(): string;
  setHTML(html: string): void;
  setHTMLCode(html: string): void;
  execCommand(command: string, value?: unknown): unknown;
  attachEvent(name: RichTextEditorEventName, handler: RichTextEditorEventHandler): void;
  detachEvent(name: RichTextEditorEventName, handler: RichTextEditorEventHandler): void;
  destroy?(): void;
  getText?(): string;
  setText?(value: string): void;
  insertHTML?(html: string): void;
  [key: string]: unknown;   // the full runtime API is reachable, untyped
}

RichTextEditorOptions

Configuration.

Common options are named and typed; the open index signature accepts any other runtime option without fighting the type-checker.

interface RichTextEditorOptions {
  id?: string;
  url_base?: string;          // where the runtime assets are served from
  toolbar?: string;           // e.g. "full" | "basic" | a custom definition
  toolbarMobile?: string;
  skin?: string;
  width?: string;
  height?: string;
  editorResizeMode?: "both" | "height" | "none" | string;
  pasteMode?: "Auto" | "Disabled" | "PasteText" | "PasteWord" | string;
  enterKeyTag?: "div" | "p" | "br" | string;
  urlType?: "default" | "absolute" | "relative" | string;
  readOnly?: boolean;
  showTagList?: boolean;
  showStatistics?: boolean;
  contentCssUrl?: string;
  previewCssUrl?: string;
  previewScriptUrl?: string;
  helpUrl?: string;
  language?: string;
  lang?: string;              // legacy alias for language
  value?: string;
  [key: string]: unknown;     // any other runtime option is accepted
}

Assets & events

Where things load from, and what fires.

Asset options control the runtime location, plugin loading, and language. Event names are typed for the common cases and stay open for any custom event the runtime emits.

interface RichTextEditorAssetOptions {
  basePath?: string;    // serve the runtime from a custom path
  loadPlugins?: boolean; // default true; set false to skip all_plugins.js
  language?: string;     // loads lang/<language>.js
}

type RichTextEditorEventName = "change" | "focus" | "blur" | "load" | (string & {});

See it in a real setup.

The getting-started guide walks the four-step install, and the framework guides show the same API inside React, Vue, and Angular.

Getting started Download