# Draftail and Draft.js documentation > Complete documentation for Draftail, a configurable rich text editor built with Draft.js. Also includes the Draft.js documentation directly combined into the Draftail documentation. This file contains links to documentation sections following the llmstxt.org standard. ## Table of Contents - [Getting started](https://www.draftail.org/introduction/getting-started.md): Draftail is built with [Draft.js](https://draftjs.org/) and [React](https://reactjs.org/). Let’s start by installing them both, as well as Draftail: - [API reference](https://www.draftail.org/reference/api.md): For projects using TypeScript, Draftail includes type definitions. - [Arbitrary controls](https://www.draftail.org/introduction/arbitrary-controls.md): > Those extensions require a good understanding of the [Draft.js](https://draftjs.org/) API. - [Blocks](https://www.draftail.org/introduction/blocks.md): Blocks provide structure to the content. They do not overlap – no content can be both a paragraph and a heading. - [Decorators](https://www.draftail.org/introduction/decorators.md): > Those extensions require a good understanding of the [Draft.js](https://draftjs.org/) API. - [Entities](https://www.draftail.org/introduction/entities.md): Entities annotate content with data to represent rich content beyond text. They can be inline (e.g. a link on a word), or block-based (e.g. an embe... - [Formatting options](https://www.draftail.org/introduction/formatting-options.md): Draftail, like Draft.js, distinguishes between 3 content formats: - [Inline styles](https://www.draftail.org/introduction/inline-styles.md): Inline styles provide inline formatting for rich text. They can overlap: text can be both bold and italic. - [Plugins](https://www.draftail.org/introduction/plugins.md): > Those extensions require a good understanding of the [Draft.js](https://draftjs.org/) API. - [Draft.js vs Draftail](https://www.draftail.org/guides/draftjs-vs-draftail.md): Do you already have some knowledge of Draft.js, and wonder how Draftail differs? Are you wondering which of the two is appropriate for your project... - [Extensions tutorial: linkify](https://www.draftail.org/guides/extensions-tutorial-linkify.md): Linkify features a type of interaction that’s easy to implement with the [Draft.js plugins](https://www.draft-js-plugins.com/) API (here, the [`han... - [Extensions tutorial: max length](https://www.draftail.org/guides/extensions-tutorial-max-length.md): - [Form validation](https://www.draftail.org/guides/form-validation.md): Draftail is easy to integrate with form validation, whether as simple "required" checks or more advanced rich text metrics. - [Getting started with extensions](https://www.draftail.org/guides/getting-started-with-extensions.md): Do you want to write extensions for Draftail? This is a good place to start. I’ll first try to discourage you from doing it (rich text is messy and... - [Importing and exporting HTML](https://www.draftail.org/guides/importing-and-exporting-html.md): Like all Draft.js editors, Draftail does not process HTML directly: It uses its own content representation. [Content storage](../reference/content-... - [Browser support and polyfills](https://www.draftail.org/reference/browser-support.md): **Supported browser / device versions:** - [Content storage](https://www.draftail.org/reference/content-storage.md): Like all Draft.js editors, Draftail does not process content directly as HTML but as a more structured format called [ContentState](https://draftjs... - [Controlled component](https://www.draftail.org/reference/controlled-component.md): Since [v1.3.0](/blog/2019/08/15/draftail-v1-3-0-community-improvements-beyond-wagtail), the editor can now be used as a [controlled component](http... - [Customising icons](https://www.draftail.org/reference/customising-icons.md): A lot of the formatting options in Draftail rely on icons for toolbar buttons, allowing an `icon?: IconProp` attribute. There are multiple possible... - [Customising toolbars](https://www.draftail.org/reference/customising-toolbars.md): By default, Draftail comes with many options for toolbars: - [i18n](https://www.draftail.org/reference/i18n.md): The editor comes with default labels in english, but all are overridable. - [Troubleshooting](https://www.draftail.org/reference/troubleshooting.md): - Pressing return on an empty list item should un-indent it until it is not nested, and then remove it. - [UI theming](https://www.draftail.org/reference/ui-theming.md): The base editor has a very simple UI and its styles are relatively straightforward. To make sure everything works, use a CSS reset, like [Normalize... - [Custom Block Components](https://www.draftail.org/draft-js/advanced-topics/Block-Components.md): Draft is designed to solve problems for straightforward rich text interfaces - [Block Styling](https://www.draftail.org/draft-js/advanced-topics/Block-Styling.md): Within `Editor`, some block types are given default CSS styles to limit the amount - [Custom Block Rendering](https://www.draftail.org/draft-js/advanced-topics/Custom-Block-Render.md): This article discusses how to customize Draft default block rendering. - [Decorators](https://www.draftail.org/draft-js/advanced-topics/Decorators.md): Inline and block styles aren't the only kind of rich styling that we might - [EditorState Race Conditions](https://www.draftail.org/draft-js/advanced-topics/EditorState-Race-Conditions.md): Draft `Editor` is a _controlled input_ component (you can read about this in detail in the [API Basics](/docs/quickstart-api-basics) section), mean... - [Entities](https://www.draftail.org/draft-js/advanced-topics/Entities.md): This article discusses the Entity system, which Draft uses for annotating - [Complex Inline Styles](https://www.draftail.org/draft-js/advanced-topics/Inline-Styles.md): Within your editor, you may wish to provide a wide variety of inline style - [Issues and Pitfalls](https://www.draftail.org/draft-js/advanced-topics/Issues-and-Pitfalls.md): This article addresses some known issues with the Draft editor framework, as - [Key Bindings](https://www.draftail.org/draft-js/advanced-topics/Key-Bindings.md): The `Editor` component offers flexibility to define custom key bindings - [Managing Focus](https://www.draftail.org/draft-js/advanced-topics/Managing-Focus.md): Managing text input focus can be a tricky task within React components. The browser - [Nested Lists](https://www.draftail.org/draft-js/advanced-topics/Nested-Lists.md): The Draft framework provides support for nested lists, as demonstrated in the - [Text Direction](https://www.draftail.org/draft-js/advanced-topics/Text-Direction.md): Facebook supports dozens of languages, which means that our text inputs need - [v0.10 API Migration](https://www.draftail.org/draft-js/api-reference/APIMigration.md): The Draft.js v0.10 release includes a change to the API for managing - [AtomicBlockUtils](https://www.draftail.org/draft-js/api-reference/AtomicBlockUtils.md): The `AtomicBlockUtils` module is a static set of utility functions for atomic - [CharacterMetadata](https://www.draftail.org/draft-js/api-reference/CharacterMetadata.md): `CharacterMetadata` is an Immutable - [CompositeDecorator](https://www.draftail.org/draft-js/api-reference/CompositeDecorator.md): See the [advanced topic article on Decorators](/docs/advanced-topics-decorators#compositedecorator). - [ContentBlock](https://www.draftail.org/draft-js/api-reference/ContentBlock.md): `ContentBlock` is an Immutable - [ContentState](https://www.draftail.org/draft-js/api-reference/ContentState.md): `ContentState` is an Immutable - [Data Conversion](https://www.draftail.org/draft-js/api-reference/Data-Conversion.md): Because a text editor doesn't exist in a vacuum and it's important to save - [Editor Component](https://www.draftail.org/draft-js/api-reference/Editor.md): This article discusses the API and props of the core controlled contentEditable - [EditorChangeType](https://www.draftail.org/draft-js/api-reference/EditorChangeType.md): [EditorChangeType](https://github.com/facebook/draft-js/blob/master/src/model/immutable/EditorChangeType.js) - [EditorState](https://www.draftail.org/draft-js/api-reference/EditorState.md): `EditorState` is the top-level state object for the editor. - [Entity](https://www.draftail.org/draft-js/api-reference/Entity.md): `Entity` is a static module containing the API for creating, retrieving, and - [KeyBindingUtil](https://www.draftail.org/draft-js/api-reference/KeyBindingUtil.md): The `KeyBindingUtil` module is a static set of utility functions for - [Modifier](https://www.draftail.org/draft-js/api-reference/Modifier.md): The `Modifier` module is a static set of utility functions that encapsulate common - [RichUtils](https://www.draftail.org/draft-js/api-reference/RichUtils.md): The `RichUtils` module is a static set of utility functions for rich text - [SelectionState](https://www.draftail.org/draft-js/api-reference/SelectionState.md): `SelectionState` is an Immutable - [API Basics](https://www.draftail.org/draft-js/quickstart/API-Basics.md): This document provides an overview of the basics of the `Draft` API. A - [Rich Styling](https://www.draftail.org/draft-js/quickstart/Rich-Styling.md): Now that we have established the basics of the top-level API, we can go a step - [Overview](https://www.draftail.org/draft-js/quickstart/overview.md): Draft.js is a framework for building rich text editors in React, powered by an immutable model and abstracting over cross-browser differences.