MARKRAHIMI.
All projects

2026

MandooEditor

A React rich-text editor component, built RTL-first for Persian, Arabic, and Hebrew

MandooEditor

Overview

MandooEditor's docs site is built around a 'Live Configurator' instead of a wall of API documentation. Toggle Visual, Text, or Block preview tabs. Switch theme and color scheme. Flip the default text direction between LTR and RTL. Choose HTML or Markdown output. Enable or disable individual toolbar buttons one at a time.

Every toggle updates a real, live editor instance on the same screen. The integration code block underneath, a genuine 'MyEditor.tsx' snippet with the exact import and props for the current configuration, regenerates alongside it. What a developer copies always matches what they just configured.

The RTL toggle isn't a footnote. The direction panel explicitly calls out Persian, Arabic, and Hebrew content, and that reflects a real gap. Most React rich-text editors treat right-to-left as a CSS override bolted on after the fact, not a first-class configuration option baked into the component from the start.

The problem

Most React rich-text editor libraries treat right-to-left languages as an afterthought, bolted on with CSS overrides. That breaks down for real Persian, Arabic, or Hebrew content, and integrating any editor usually means digging through docs to find the one config flag you actually need.

The approach

A component library with a live, visual configurator instead of a static docs page. Every toggle, theme, direction, output format, toolbar buttons, updates a real editor instance and regenerates the exact integration code to copy into a project.

Key features

  • Visual, Text, and Block editing modes with live preview switching
  • A first-class RTL direction toggle, explicitly designed for Persian, Arabic, and Hebrew content
  • Classic and Modern themes paired with Light and Dark color schemes
  • HTML or Markdown output, selectable per integration
  • Per-button toolbar configuration: bold, italic, lists, blockquote, and more, independently toggleable
  • Live-generated integration code ('MyEditor.tsx') that mirrors the exact configurator state, copyable in one click

Impact

3

Editing modes: visual, text, block

3

RTL-ready languages targeted: Persian, Arabic, Hebrew

2

Output formats: HTML and Markdown

Have something similar in mind?

I'm open to software, full-stack, and AI engineering roles and projects across France and Europe.

Get in touch