---
title: "Rich Text — Converters (Lexical)"
aliases: [lexical-converters, richtext-converters, lexical-export]
tags: [payloadcms, lexical, rich-text, converters, html, markdown, jsx, plaintext]
sources: [raw/rich-text__converters.md]
created: 2026-05-15
updated: 2026-05-15
---

## Overview

Lexical rich text fields store data as **JSON**. Payload provides converters to transform that JSON into other formats for rendering or export.

## Supported Output Formats

| Format | Reference |
|--------|-----------|
| JSX | `/docs/rich-text/converting-jsx` |
| HTML | `/docs/rich-text/converting-html` |
| Plaintext | `/docs/rich-text/converting-plaintext` |
| Markdown / MDX | `/docs/rich-text/converting-markdown` |

## Retrieving the Editor Config

Some converters need access to the **Lexical editor config** (defines available features/nodes). Use `editorConfigFactory` from `@payloadcms/richtext-lexical`.

```ts
import { editorConfigFactory } from '@payloadcms/richtext-lexical'
```

### Option 1 — Default config

```ts
const editorConfig = await editorConfigFactory.default({ config })
```

### Option 2 — Extract from a field

When you have a sanitized field reference (e.g. inside a hook on a sibling field):

```ts
const editorConfig = editorConfigFactory.fromField({ field })
```

### Option 3 — Custom features config

```ts
import { FixedToolbarFeature } from '@payloadcms/richtext-lexical'

const editorConfig = await editorConfigFactory.fromFeatures({
  config,
  features: ({ defaultFeatures }) => [...defaultFeatures, FixedToolbarFeature()],
})
```

### Option 4 — From an instantiated editor (not recommended)

```ts
const editorConfig = await editorConfigFactory.fromEditor({ config, editor })
```

> Prefer `fromFeatures` — extract features into a variable and reuse.

## Practical Pattern — Get Config in a Hook

Access the lexical editor config of a sibling `richText` field from an `afterRead` hook on another field:

```ts
import type { CollectionConfig, RichTextField } from 'payload'
import { editorConfigFactory, lexicalEditor } from '@payloadcms/richtext-lexical'

export const MyCollection: CollectionConfig = {
  slug: 'slug',
  fields: [
    {
      name: 'text',
      type: 'text',
      hooks: {
        afterRead: [
          ({ siblingFields, value }) => {
            const richTextField = siblingFields.find(
              (f) => 'name' in f && f.name === 'richText',
            ) as RichTextField

            const editorConfig = editorConfigFactory.fromField({ field: richTextField })
            // use editorConfig to run a converter
            return value
          },
        ],
      },
    },
    {
      name: 'richText',
      type: 'richText',
      editor: lexicalEditor(),
    },
  ],
}
```

## Key Takeaways

- Lexical stores rich text as **JSON** — converters transform it to HTML/JSX/Markdown/Plaintext.
- Always import `editorConfigFactory` from `@payloadcms/richtext-lexical`.
- Four factory methods: `default`, `fromField`, `fromFeatures`, `fromEditor` — prefer `fromFeatures` for custom setups.
- Access a sibling field's editor config via `editorConfigFactory.fromField({ field })` inside hooks.
- `fromEditor` is least efficient — avoid unless you already have an instantiated editor.

## Related

- [[wiki/payloadcms/rich-text|Rich Text (Lexical) — Overview]]
- [[wiki/payloadcms/rich-text-blocks|Rich Text — Blocks (BlocksFeature)]]
- [[wiki/payloadcms/fields-rich-text|Rich Text Field Config]]
- [[wiki/payloadcms/hooks-fields|Field Hooks]]
- [[wiki/payloadcms/hooks-collections|Collection Hooks]]

## Sources

- `raw/rich-text__converters.md`
- https://payloadcms.com/docs/rich-text/converters
