The Principal Dev – Masterclass for Tech Leads

The Principal Dev – Masterclass for Tech LeadsNov 27-28

Join

Lexical

An extensible text editor framework that provides excellent reliability, accessibility and performance.

NPM Version NPM Downloads Build Status Discord Twitter Follow

Documentation | Getting Started | Playground | Gallery


Features

Quick Start

npm install lexical @lexical/react
import { $getRoot, $getSelection } from 'lexical';
import { LexicalComposer } from '@lexical/react/LexicalComposer';
import { PlainTextPlugin } from '@lexical/react/LexicalPlainTextPlugin';
import { ContentEditable } from '@lexical/react/LexicalContentEditable';
import { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin';
import { LexicalErrorBoundary } from '@lexical/react/LexicalErrorBoundary';

const initialConfig = {
  namespace: 'MyEditor',
  onError: (error) => console.error(error),
};

function Editor() {
  return (
    <LexicalComposer initialConfig={initialConfig}>
      <PlainTextPlugin
        contentEditable={<ContentEditable />}
        ErrorBoundary={LexicalErrorBoundary}
      />
      <HistoryPlugin />
    </LexicalComposer>
  );
}

Try it yourself:

Development

# Install dependencies
npm install

# Start playground dev server
npm run start

# Run tests
npm run test-unit
npm run test-e2e-chromium

# Lint and type check
npm run ci-check

See CONTRIBUTING.md for detailed development guidelines.

Documentation

Community & Support

Browser Support

Browser Version
Chrome 49+
Firefox 52+
Safari 11+
Edge 79+

Contributors

We welcome contributions! Please read our Contributing Guide to learn about our development process and how to propose bugfixes and improvements.

License

MIT License © Meta Platforms, Inc.

Join libs.tech

...and unlock some superpowers

GitHub

We won't share your data with anyone else.