lexical

What is lexical?

Lexical is a modern, extensible text editor framework that provides a set of tools and APIs to build rich text editors with ease. It is designed to be highly performant, flexible, and easy to integrate into various applications.

What are lexical's main functionalities?

Basic Text Editing

This feature allows you to create a basic text editor instance and perform simple text editing operations such as appending text.

const { createEditor } = require('lexical');
const editor = createEditor();
editor.update(() => {
  const root = editor.getRoot();
  root.appendText('Hello, Lexical!');
});

Custom Plugins

Lexical supports custom plugins to extend the editor's functionality. This example demonstrates how to create a custom plugin that logs the editor state changes.

const { createEditor, LexicalComposer } = require('lexical');
const MyCustomPlugin = () => {
  return {
    onChange(editorState) {
      console.log('Editor state changed:', editorState);
    }
  };
};
const editor = createEditor({ plugins: [MyCustomPlugin] });

Rich Text Formatting

This feature allows you to apply rich text formatting such as bold, italic, and underline to the text within the editor.

const { createEditor, $createParagraphNode, $createTextNode } = require('lexical');
const editor = createEditor();
editor.update(() => {
  const root = editor.getRoot();
  const paragraph = $createParagraphNode();
  const text = $createTextNode('Bold Text');
  text.toggleFormat('bold');
  paragraph.append(text);
  root.append(paragraph);
});

Other packages similar to lexical

draft-js

Draft.js is a rich text editor framework for React. It provides a set of tools to build complex text editors with support for rich text formatting, custom blocks, and more. Compared to Lexical, Draft.js is more mature but may have a steeper learning curve and less flexibility in terms of customization.

slate

Slate is another highly customizable framework for building rich text editors in React. It offers a more flexible and extensible architecture compared to Draft.js, allowing developers to define their own data models and editor behaviors. Slate is similar to Lexical in terms of flexibility but may require more boilerplate code to set up.

prosemirror

ProseMirror is a toolkit for building rich text editors with a focus on extensibility and performance. It provides a highly customizable schema system and a range of plugins to extend the editor's capabilities. ProseMirror is comparable to Lexical in terms of performance and extensibility but may have a more complex API.

README

lexical

by xdf

Installment

$ sudo npm install lexical -g

Quick Start

$ lexical xdf

License

The MIT License (MIT)

Copyright (c) 2013 xdf

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.