RangeMenu

Your Froala editor is missing a right-click menu

Every serious editor puts cut, copy, table tools and inserts one right-click away. Froala shows the browser default. RangeMenu fixes that: a native-feeling context menu you configure in a few lines, with nested submenus and access to every Froala command.

One-time purchase. Every 1.x update included.

yourapp.com/reports/q3

Right-click anywhere in this document ↓

Q3 summary

Revenue grew 14% on the back of the September launch. The projections in the appendix assume the same run rate through Q4.

RegionRevenue
APAC$1.9M
Europe$1.2M

What you get

Any Froala command, by name

Write 'bold', 'insertLink' or 'formatUL' in your item list and RangeMenu runs it through Froala's own command pipeline, with titles, translations and undo included. If the command's plugin isn't loaded, the item quietly drops out instead of rendering dead.

Context where it counts

Right-click inside a table and row and column operations appear. On an image: image actions. On a link: edit and remove. All powered by Froala's plugins, all removable with one option if you'd rather define your own.

Submenus, as deep as you need

Items nest. Hover intent, viewport-aware flipping and full keyboard navigation (arrows, Enter, Escape) come with them. Focus stays in the editor the whole time, so the user's selection is never thrown away.

Your items, your rules

An item is a title and a function. Add icons, shortcut hints, disabled/hidden predicates evaluated per right-click, and register named items once to reuse across every editor in your app.

Behaves like a native menu

The caret moves to where you clicked. A click inside an existing selection keeps it, so Cut and Copy still work. Light, dark, or follow-the-OS themes, restyled with a handful of CSS custom properties.

Drops into what you have

TypeScript source, ESM/CJS builds with type definitions, and a script-tag build for no-bundler pages. Framed and inline editors, shadow DOM, and as many editors per page as you like, each with its own configuration.

Quickstart

Two lines to register, one option to configure.

npm

import FroalaEditor from 'froala-editor';
import { registerRangeMenu } from 'rangemenu';

registerRangeMenu(FroalaEditor);

new FroalaEditor('#editor');  // default menu is on

Script tag

<script src="froala/js/froala_editor.min.js"></script>
<script src="rangemenu/dist/rangemenu.min.js"></script>

Configure per editor

new FroalaEditor('#editor', {
  rangeMenu: {
    items: [
      'cut', 'copy', 'paste',
      '-',
      'insertLink', 'bold',   // any Froala command
      {
        title: 'Insert Greeting',
        items: [                    // nested submenu
          { title: 'Formal', action: (ed) => ed.html.insert('Dear colleague,') },
          { title: 'Casual', action: (ed) => ed.html.insert('Hey!') },
        ],
      },
    ],
    theme: 'auto',
  },
});

That is the shape of it. The documentation covers every option, the item reference, contextual sections, theming, and recipes.

Pricing

One licence, one payment, use it everywhere you build.

$20 one-time

  • Unlimited projects and domains
  • TypeScript source plus built ESM, CJS and script-tag bundles
  • All 1.x updates included
  • Covers Froala Editor v4 and v5 (bring your own Froala licence)
Buy RangeMenu for $20

A new paid major is released only if a future Froala major requires breaking changes. Until then, every update is yours.

Questions

Do I need a Froala licence?
Yes. RangeMenu is a plugin for Froala Editor, which is a separate commercial product. RangeMenu works with Froala v4 and v5.
Does it work with React, Vue, or Angular wrappers?
Yes. Registration targets the FroalaEditor constructor, so any wrapper that exposes editor options works. Pass rangeMenu in the same config object you already use.
Can I fully replace the default items?
Yes. items replaces the whole list, and contextual: false removes the table/image/link sections. What remains is exactly what you declared.
What about the browser's own context menu?
Set rangeMenu: false on any editor to keep the native menu there. Everywhere else, RangeMenu replaces it only inside the editing area.
Is it really a one-time purchase?
Yes. You pay again only if a future major Froala release forces a breaking RangeMenu rewrite, and your existing version keeps working regardless.